欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jQuery选择器之id选择器

程序员文章站 2022-03-06 21:06:31
jquery选择器之id选择器。jquery几乎支持主流的css1~css3选择器的写法,我们从最简单的也是最常用的开始学起。 id选择器:用来查找的id,即元素的id属性...

jquery选择器之id选择器。jquery几乎支持主流的css1~css3选择器的写法,我们从最简单的也是最常用的开始学起。
id选择器:用来查找的id,即元素的id属性

$( "#id" )

id选择器也是基本的选择器,jquery内部使用javascript函数document.getelementbyid()来处理id的获取。原生语法的支持总是非常高效的,所以在操作dom的获取上,如果能采用id的话尽然考虑用这个选择器。
id是唯一的,每个id值在一个页面中只能使用一次。如果多个元素分配了相同的id,将只匹配该id选择集合的第一个dom元素。但这种行为不应该发生;有超过一个元素的页面使用相同的id是无效的

<meta content="text/html; charset=utf-8" http-equiv="content-type" />
<title></title>
<style type="text/css">
p {
        width: 100px;
        height: 90px;
        float: left;
        padding: 5px;
        margin: 5px;
        background-color: #eeeeee;
    }</style>
<script src="https://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
<p id="aaron">
<p>id=&quot;aaron&quot;</p>
<p>选中</p>
</p>
<p id="imooc">
<p>id=&quot;imooc&quot;</p>
<p>jquery选中</p>
</p>
<p id="imooc">
<p>id=&quot;imooc&quot;</p>
<p>jquery未选中</p>
</p>
<script type="text/javascript">
       //通过原生方法处理
        var p = document.getelementbyid('aaron');
        p.style.border = "3px solid blue";
    </script><script type="text/javascript">
        //通过jquery直接传入id
        //id的唯一,只选择到了第一个匹配的id为imooc的p节点
        ?$("#imooc").css("border", "3px solid red");
    </script>