JQuery选择器的使用和分类

jQuery选择器

id选择器格式

$("#box")      //获取标签里的id是box的标签

类选择器格式

$(".a")      //获取标签里的类名是a的标签

标签选择器格式

$("div")     //获取标签是div的标签

结构选择器格式

$("li:mth-child(odd)")   //获取标签是li的奇数的li

综合实例

//作用：获取元素

<!doctype html>
<html>
<head>
<meta charset="utf-8">
    <!--导入jQuery-->
<script src="jquery-3.6.0.min.js"></script>
<style>

</style>
</head>
<body>
	<ul>
		<li class="a">12</li>
		<li>34</li>
		<li>4</li>
		<li class="a">5</li>
		<li>55</li>
		<li id="box">999</li>	
	</ul>

<script>
     //id选择器
     var li1=$("#box")
	 console.log($("#box"))
    
     //类选择器
     var li2=$(".a")
	 console.log($(".a"))

     //标签选择器
     var li2=$("li")
	 console.log($("li"))

    //结构选择器
       //获取所有奇数个li
     var li2=$("li:nth-child(odd)")
	 console.log($("li:nth-child(odd)"))
     //获取所有第个偶数li
     var li2=$("li:nth-child(even)")
	 console.log($("li:nth-child(even)"))
</script>
</body>
</html>
posted @ 2022-01-17 16:43  永恒之月TEL  阅读(38)  评论(0)  编辑  收藏  举报