js 获取当前元素的父元素的父元素的id

最新推荐文章于 2023-03-27 18:11:25 发布

原创最新推荐文章于 2023-03-27 18:11:25 发布 · 3.6w 阅读

8 ·

CC 4.0 BY-SA版权

django 同时被 2 个专栏收录

51 篇文章

订阅专栏

16 篇文章

订阅专栏

本文对比了在JavaScript中使用onclick属性与jQuery click方法触发函数的区别。通过两个具体实例，详细解析了这两种方式获取DOM元素ID的方法，展示了不同场景下它们的行为差异。

情景一：用onclick触发的函数

html代码：
<div id="0" style="border-bottom:1px solid #000;margin:0 auto;">
    <div>1111</div>
    <div class="original">
        <div id="chartx1" class="chartstyle"></div>
        <div id="charty1" class="chartstyle" ></div>
        <button onclick="getDetail(this);" style="width:100%;height:30px;">查看信息</button>
    </div>
</div>
<script>
    function getDetail(obj){
        alert(obj.parentNode.parentNode.id);    //1
    }
</script>

运行结果：

情景二:直接用click触发的函数

html代码：
<div id="0" style="border-bottom:1px solid #000;margin:0 auto;">
    <div>1111</div>
    <div class="original">
        <div id="chartx1" class="chartstyle"></div>
        <div id="charty1" class="chartstyle" ></div>
        <button class="info_detail" style="width:100%;height:30px;">查看信息</button>
    </div>
</div>
<script>
     $(".info_detail").click(function(){
         id=$(this).parent().parent().attr('id');
     })
</script>

参考自：https://bbs.youkuaiyun.com/topics/370175483