首页 > web前端 > js教程 > 怎样使用vue判断dom的class

怎样使用vue判断dom的class

php中世界最好的语言
发布: 2018-06-02 10:10:32
原创
2419 人浏览过

这次给大家带来怎样使用vue判断dom的class,使用vue判断dom的class注意事项有哪些,下面就是实战案例,一起来看一下。

vue点击给dom添加class然后获取含有class的dom

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

<p class="chose-ck" v-for="(item,index2) in colors" :key="index2" ref="chosebox">

                  <p>{{item.name}}</p>

                  <dt v-for="(item2,index) in item.childsCurGoods" :key="item2.id" :class="index==iac[index2]?&#39;check&#39;:&#39;&#39;" :id="item2.id" :data-chosename="item.name" :data-choseidname="item2.name" :data-chose="item.id" :data-id="item2.id" @click="chek(index2,index)" >

                    {{item2.name}}

                  </dt>

                </p>js

  chek(index2, index) {

      this.iac[index2] = index

      this.iac = this.iac.concat([]);

      this.checkchose()

    },

    checkchose:function(){

      var chose=this

      var chosedom=chose.$refs.chosebox

      console.log(chosedom)

      for (var i=0;i<chosedom.length;i++) {

        var children=chosedom[i].children

        for (var j=0;j<children.length;j++) {  

          if(children[j].className=="check")

          {

            console.log(children[j])

          }

        }

      }

       

    }

登录后复制

点击过后获取到的dom打印

1

if(children[j].className=="check")

登录后复制

加了判断为什么打印出来的dom是点击之前的dom

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

Node.js+console输出日志文件实例分析

如何使用Vue实现拖拽效果

以上是怎样使用vue判断dom的class的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板