vue如何判断dom的class


Posted in Javascript onApril 26, 2018

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

<div 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]?'check':''" :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>
                </div>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打印

vue如何判断dom的class

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

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

vue如何判断dom的class

总结

以上所述是小编给大家介绍的vue如何判断dom的class,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js 方法实现返回多个数据的代码
Apr 30 Javascript
JavaScript 对象模型 执行模型
Oct 15 Javascript
JS远程获取网页源代码实例
Sep 05 Javascript
javascript计算星座属相(十二生肖属相)示例代码
Jan 09 Javascript
JavaScript实现简单的数字倒计时
May 15 Javascript
JavaScript检测鼠标移动方向的方法
May 22 Javascript
Node.js编程中客户端Session的使用详解
Jun 23 Javascript
jQuery 判断是否包含在数组中Array[]的方法
Aug 03 Javascript
wap手机端解决返回上一页的js实例
Dec 08 Javascript
基于react框架使用的一些细节要点的思考
May 31 Javascript
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
JavaScript使用小插件实现倒计时的方法讲解
Mar 11 Javascript
vue 中filter的多种用法
Apr 26 #Javascript
vue自定义filters过滤器
Apr 26 #Javascript
JavaScript实现微信红包算法及问题解决方法
Apr 26 #Javascript
react 创建单例组件的方法
Apr 26 #Javascript
node打造微信个人号机器人的方法示例
Apr 26 #Javascript
Vue 使用中的小技巧
Apr 26 #Javascript
基于Vue实现拖拽功能
Jul 29 #Javascript
You might like
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
php smarty模版引擎中的缓存应用
2009/12/02 PHP
php上传文件,创建递归目录的实例代码
2013/10/18 PHP
PHP中使用BigMap实例
2015/03/30 PHP
PHP session垃圾回收机制实例分析
2019/06/28 PHP
Yii框架页面渲染操作实例详解
2019/07/19 PHP
我也种棵OO树JXTree[js+css+xml]
2007/04/02 Javascript
取得窗口大小 兼容所有浏览器的js代码
2011/08/09 Javascript
js拦截alert对话框另类应用
2013/01/16 Javascript
简易js代码实现计算器操作
2013/04/15 Javascript
JavaScript中for循环的使用详解
2015/06/03 Javascript
jQuery实现可编辑的表格实例讲解(2)
2015/09/17 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
2015/11/18 Javascript
JS基于构造函数实现的菜单滑动显隐效果【测试可用】
2016/06/21 Javascript
vue省市区三联动下拉选择组件的实现
2017/04/28 Javascript
详解vue-cli中配置sass
2017/06/21 Javascript
详解ng-alain动态表单SF表单项设置必填和正则校验
2019/06/11 Javascript
使用python实现strcmp函数功能示例
2014/03/25 Python
python检测远程udp端口是否打开的方法
2015/03/14 Python
Python利用ansible分发处理任务
2015/08/04 Python
详解Python函数作用域的LEGB顺序
2016/05/14 Python
Python3 XML 获取雅虎天气的实现方法
2018/02/01 Python
Python中的单行、多行、中文注释方法
2018/07/19 Python
Python TestCase中的断言方法介绍
2019/05/02 Python
python3中eval函数用法使用简介
2019/08/02 Python
python打开音乐文件的实例方法
2020/07/21 Python
莫斯科绝对前卫最秘密的商店:SVMoscow
2017/10/23 全球购物
Noon埃及:埃及在线购物
2019/11/26 全球购物
土木工程毕业生自荐信
2013/11/12 职场文书
一年级数学教学反思
2014/02/01 职场文书
水利水电专业自荐信
2014/07/08 职场文书
机关党员四风问题个人整改措施
2014/10/26 职场文书
2015年环卫处个人工作总结
2015/07/27 职场文书
2016年校园社会综合治理宣传月活动总结
2016/03/16 职场文书
Mysql 如何批量插入数据
2021/04/06 MySQL
4种非常实用的python内置数据结构
2021/04/28 Python