jQuery中的this关键字

最新推荐文章于 2024-07-23 20:57:47 发布

little_sunlight

最新推荐文章于 2024-07-23 20:57:47 发布

阅读量4.5k

点赞数 1

分类专栏： jQuery 文章标签： jquery JavaScript this

本文链接：https://blog.csdn.net/qq_34538534/article/details/82910370

版权

jQuery 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

jQuery中的this关键字示例：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="jquery-3.3.1.js"></script>
<title>无标题文档</title>
</head>

<body>
    <h2>特殊选择器this</h2>

    <p id="test1">点击测试：通过原生DOM处理</p>
    
    <p id="test2">点击测试：通过原生jQuery处理</p>

    <script type="text/javascript">
        var p1 = document.getElementById('test1')
        p1.addEventListener('click',function(){
            //直接通过dom的方法改变颜色
            this.style.color = "red"; 
        },false);
    </script>

    <script type="text/javascript">
        $('#test2').click(function(){
            //通过包装成jQuery对象改变颜色
            $(this).css('color','blue');
        })
    </script>

</body>

</html>

在浏览器中运行显示初始界面：