1.设置定义属性值  :data-value=".."

<ul class="header-ul">
<li class="flexcss" v-for="(list,index) in child" :data-value="list.name" @click="changeContent(index,list.name)">{{list.name}}</li>
</ul>
methods: {
changeHeaderContent(index,name){
console.log('cht',index)
console.log('chaname',name)
}

2.直接获取

<div class="c-img-box" @click="gotoDetail(name)" :data-value="name">
data () {
return {
msg: 'Welcome to Your Vue.js App',
name:'czj',
}
},
gotoDetail:function(ev){
console.log(ev);
},

3.通过this.$refs.***获取

1.目标DOM定义ref值:

2.通过 【this.$refs.***.属性名】 获取相关属性的值:

this.$refs.***   获取到对应的元素

vuejs2.0如何获取dom元素自定义属性值的更多相关文章

  1. (四)Jsoup 获取 DOM 元素属性值

    第一节: Jsoup 获取 DOM 元素属性值 Jsoup获取DOM元素属性值 比如我们要获取博客的href属性值: 我们这时候就要用到Jsoup来获取属性的值 : 我们给下示例代码: package ...

  2. Jsoup(四)-- Jsoup获取DOM元素属性值

    1.获取博客园的博客标题以及博客地址,获取友情链接 2.代码实现: public static void main(String[] args) throws Exception{ // 创建http ...

  3. vue 组件传递值以及获取DOM元素的位置信息

    1.父组件 select_li.vue 1.1 父组件模板 <template> <div id='selectLi' ref="selectLi"> &l ...

  4. React 点击删除列表中对应项(React 获取DOM中自定义属性)

    点击删除按钮,删除列表中对应项本来是React比较基础的应用,可是应用情况变得复杂了以后,我还真想了一会儿才搞定. 简化一下应用场景:点击新增按钮,增加一条输入框,点击输入框旁边的按钮,删除该输入框( ...

  5. 获取DOM元素位置和尺寸大小

    JavaScript获取DOM元素位置和尺寸大小 在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果,这种时候我们经常会用到一些元素位置和尺寸的计算,浏览器兼容性问题也是不可忽 ...

  6. vue(4)—— vue的过滤器,监听属性,生命周期函数,获取DOM元素

    过滤器 vue允许自定义过滤器,我个人认为,过滤器有两种,一种是对数据的清洗过滤,一种是对数据切换的动画过滤 数据切换的动画过滤 这里还是利用前面的动态组件的例子: 这里由于没办法展示动画效果,代码如 ...

  7. angular学习笔记-angular中怎么获取dom元素

    步骤分解: 第一步:给要获取的元素一个ng-model变量,并且绑定事件啦! <div class="home" ng-model="dirName" n ...

  8. vue获取dom元素注意问题

    mounted(){ setTimeout(()=>{ this.contentToggle(); },1000) }, methods:{ contentToggle(){ console.l ...

  9. vue获取dom元素高度的方法

    获取高度: <div ref="自定义名称" > </div>要在钩子mounted里面dom结构生成后去获取dom的高度,宽度,修改样式等操作!!! mo ...

随机推荐

  1. 【XSY2666】排列问题 DP 容斥原理 分治FFT

    题目大意 有\(n\)种颜色的球,第\(i\)种有\(a_i\)个.设\(m=\sum a_i\).你要把这\(m\)个小球排成一排.有\(q\)个询问,每次给你一个\(x\),问你有多少种方案使得相 ...

  2. 2.5 time 模块

  3. mac/Linux/centos ssh连接服务器以及跳板机,实现类型Xshell 功能

    1. 由于之前一段时间,公司测试服务器需要有跳板机这种操作,由于mac机器上没有类似Xshell这种程序,所以,只能自己造轮子啦. 本程序采用Shell+Expect脚本编写 具体代码请查看:http ...

  4. mongodb3.6集群搭建:分片+副本集

    mongodb是最常用的noSql数据库,在数据库排名中已经上升到了前五.这篇文章介绍如何搭建高可用的mongodb(分片+副本)集群. 在搭建集群之前,需要首先了解几个概念:路由,分片.副本集.配置 ...

  5. LCA(ST倍增)

    时间复杂度: dfs树,求st表(状态数组f):O(NlgN) 处理M个查询:O(MlgN) 总:O((M+N)lgN) #include<iostream> #include<cs ...

  6. line-height && vertical-align 学习总结

    前言 line-height.font-size.vertical-align是设置行内元素布局的关键属性.这三个属性是相互依赖的关系,改变行间距离.设置垂直对齐等都需要它们的通力合作. 行高 lin ...

  7. JavaScript 的正则也有单行模式了

    正则表达式最早是由 Ken Thompson 于 1970 年在他改进过的 QED 编辑器里实现的,正则里最简单的元字符 “.” 在当时所匹配的就是除换行符外的任意字符: "." ...

  8. AngularJS DI(依赖注入)实现推测

    AngularJS DI(依赖注入) http://www.cnblogs.com/whitewolf/archive/2012/09/11/2680659.html 回到angularjs:在框架中 ...

  9. 代码,python1

    def main(): try: number1,number2=eval(input("please enter two number")) result=number1/num ...

  10. APPLE-SA-2019-3-25-1 iOS 12.2

    APPLE-SA-2019-3-25-1 iOS 12.2 iOS 12.2 is now available and addresses the following: CFStringAvailab ...