jQuery基本选择器

jQuery中的基本选择器

1.#id:根据给定的ID匹配一个元素。

使用任何的元字符作为名称的文本部分, 它必须被两个反斜杠转义:\\

使用示例:

<div id="div1"></div> //在html中
$('#div1')  //jquery中
//查找ID为div1的元素
<script> const div1=document.getElementById('div1')
console.log('div1') console.log($('div1')) //jQuery中输出div1 </script>

2.element: 根据给定的元素标签名匹配所有元素 。

一个用于搜索的元素。指向 DOM 节点的标签名。

使用示例:

const div1=document.getElementById('div1')   //js中获取dom
$('div1')   //jquery获取dom 

3..class: 根据给定的css类名匹配元素

一个用以搜索的类。一个元素可以有多个类,只要有一个符合就能被匹配到。

使用示例:

//获取类名为active的元素
<body> <input type="text" class="active"> <input type="password" class="active"> </body> </html> <script> $('.class') console.log( $('.active')) //输出类名为active的元素
</script>

4. *:结合上下文来搜索,匹配所有元素。

使用示例:

<script>
console.log($('*'))
</script>   //查找所有的元素

5. selector1,selector2,selectorN: 找到匹配任意一个类的元素。

selector1:一个有效的选择器

selector2:另一个有效的选择器

selectorN:任意多个有效选择器

使用示例:

<body>
<div>111</div>
<p class="">222</p>
<span>333</span>
<p class="active">444</p>
</body>
</html>
<script>
   console.log($('div,span,p.active'))
</script>  //查找div、span、和类名为active的p标签

 

 

上一篇:修改css样式


下一篇:Good morning, 我们回来了