`

如何获取当前id与class

 
阅读更多

       有时候我们需要在点击一个按钮时得到他的id或class并对它进行操作,经过在网上查找,我总结了以下一些获取当前id与class的方法。

一、JS原生方法

this.id

this.className

 

二、jquery中的方法

($(this).attr('id'))

$(this).attr("class")

 

三、利用target 事件属性

       target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素、文档或窗口。

语法:event.target

获取id:event.target.id

获取text:event.target.textContent

获取class:event.target.className

获取value:event.target.value

(尽量使用event.target.id,不要使用this.id。

当使用事件委托的时候,this指向的是绑定监听事件的元素,而非被点击的元素。event.target.id则始终指向被点击的元素)

分享到:
评论

相关推荐

    vue如何判断dom的class

    vue点击给dom添加class然后获取含有class的dom <div class=chose-ck v-for=(item,index2) key=index2 ref=chosebox> <p>{{item.name}} <dt v-for=(item2,index) in item.childsCurGoods :key=item2.id :class=...

    C# 获取U盘ID序列号及U盘信息

    获取U盘ID序列号 VS2005编译通过,源码源自CSDN。已经测试好用。 可以获得U盘名称,制造商ID号 版本号 U盘序列号及容量 Form1.cs using System; using System.Collections.Generic; using System.ComponentModel; ...

    获取当前点击按钮的id用this.id实现

    代码如下: function getid(id) { alert(id); } <input id=”btn1″ type=”button” value=”test” onclick=”return getid(this.id)” />

    在Vue中获取自定义属性方法:data-id的实例

    获取自定义属性的方法: 第一步:首先在标签上绑定上@click=”getDateId(item.id)”,并将属性值传到绑定的事件里面 ...<h2 class=left click='getDataId(item.id)' data-id=item.id> [removed] methods: { ge

    ID3源码分析

    public class Id3 extends Classifier Id3[]成员变量是递归保存树的变量,数据中每一个元素都是当前结点的子结点。 /** The node's successors. */ private Id3[] m_Successors; Attribute 是属性类,m_Attribute 是...

    获取当前按钮或者html的ID名称实例(推荐)

    由于图片id是随机的,用点击img或者点击class,获取id都不行,最后用onclick事件获取。 js代码如下: $(#pic).append(<img xss=removed id='+num+' xss=removed>); 开始这样获取: function upimg(){ var id= $...

    vue–点击当前增加class,其他删除class的方法

    (data,key,index) in datas' v-on:click=addClassFun(index) v-bind:class='{class1:index==qwerqwre}'>{{data.data}} [removed] new Vue({ el: '#app', data: { datas: { data1: { data: 测试1, ifAdd: 0 }, data2...

    jquery获取input输入框中的值

    如何用javascript获取input输入框中的值,js/jq通过name、id、class获取input输入框中的value 先准备一段 HTML <input type="text" id="CN_NAME" name="CN_NAME" class="CN_NAME"> 一、jquery获取input文本框...

    jQuery 获取对象 基本选择与层级

    根据 id 选择(通过 id 只能选择一个对象), 如: $(“#div2”) <div id=”div1″>AAA</div> <div id=”div2″>BBB</div> <div id=”div3″>CCC</div> 根据标签选择, 如: $(“span”) <div><span>AAA</span></div> ...

    Javascript获取标签ID改变style属性的代码

    下面的这段代码中,我们通过select元素的name属性来设置具体要访问style的哪个属性(本例中为背景色),这样,这个函数就可以用来设置不同的CSS属性了

    vue.js 获取当前自定义属性值

    点击h5 标签,如何才能获取当前对应的自定义属性值呢? 想当然的我最开始这样写: <h5 class=left click='getDataId' data-id=item.id> [removed] methods: { getDataId() { console.log(this.data-id); } },...

    Android开发中关于获取当前Activity的一些思考

    在Android开发过程中,我们有时候需要获取当前的Activity实例,比如弹出Dialog操作,必须要用到这个。关于如何实现由很多种思路,这其中有的简单,有的复杂,这里简单总结一下个人的一些经验吧。 反射 反射是我们...

    layui-table表复选框勾选的所有行数据获取的例子

    项目需求,可以用复选框勾选项目进行提交,如下表...<table class=layui-table lay-data={url: lay-filter=test3> <th lay-data={type:>ID <th lay-data={field:>ID 测试项 <th lay-data={field:'t2', edit:

    非常好的html+css+js网页设计项目资源,分享出来.zip

    1.登录、注册,获取当前时间 HTML部分:这块分为两部分,上下两个大盒子,第一块包含登录、注册,获取时间。下面主要由LOGO、导航栏组成。通过a标签超链接组成,鼠标划过会有...--获取当前时间--> <div ...

    JS获取计算机mac地址以及IP的实现方法

    JS获取计算机mac地址以及IP的实现方法 代码如下://这两个是系统里的ActiveX插件 用来获取ip以及物理地址 <OBJECT id=locator classid=CLSID:76A64158-CB41-11D1-8B02-00600806D9B6 VIEWASTEXT> </...

    Android获取手机本机号码的实现方法

    Android获取手机本机号码的实现方法 反射TelephoneManager 获取本机号码,注意一下提供的接口有的SIM卡没写是获取不到的,该接口只适配Android5.0以上版本  public String getMsisdn(int slotId) { ... public class

    ReactUniqueID:响应以获取唯一元素ID的HOC

    ReactUniqueID响应以获取/创建唯一元素ID的HOC 这个ReactJS HOC提供了让您为当前组件生成唯一ID的方法。 当您需要为标签及其各自的输入分配for=""属性时,此功能很有用。安装 ```//Will be updating soon```用法示例...

    Android开发获取当前系统日期和时间功能示例

    本文实例讲述了Android开发获取当前系统日期和时间功能。分享给大家供大家参考,具体如下: 安卓 获得系统时间 public class MainActivity extends AppCompatActivity { @Override protected void onCreate...

    JS添加或修改控件的样式(Class)实现方法

    input id=txtBianCeng type=text /> .lezhu99 { color:#cc0000; } 添加或修改样式(Class) document.getElementById(txtBianCeng).className = lezhu99; 删除样式(Class) document.getElementById...

    Android编程实现悬浮窗获取并显示当前内存使用量的方法

    本文实例讲述了Android编程实现悬浮窗获取并显示当前内存使用量的方法。分享给大家供大家参考,具体如下: 运行效果: 其中: 这一块就是悬浮窗,可以随意拖动,动态显示当前内存使用量。 下面看一下代码是如何...

Global site tag (gtag.js) - Google Analytics