詳談JQuery中id選擇器和class選擇器的差別於聯繫
- 巴扎黑原創
- 2017-06-20 16:57:202203瀏覽
下面小編就為大家帶來一篇老生常談jquery id選擇器和class選擇器的差別。小編覺得蠻不錯的，現在就分享給大家，也給大家做個參考。一起跟著小編過來看看吧
實例如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="jquery-2.1.4.js"></script>
<script type="text/javascript" src="dams.js">
</script>
</head>
<body>
<p class="box">hello</p>
<p class="box">world</p>
</body>
</html>
$(function(){
alert($('.box').size()); //返回2
});size() 方法傳回DOM物件的個數
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="style.css" rel="external nofollow" rel="external nofollow" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="jquery-2.1.4.js"></script>
<script type="text/javascript" src="dams.js">
</script>
</head>
<body>
<p id="box">hello</p>
<p id="box">world</p>
</body>
</html>
$(function(){
alert($('#box').size()); //只能获得一个id=box的DOM对象，返回1
});即： id是唯一的，即使有多個id相同的元素，jquery選擇器也只能取得其中一個。所以：想在jquery中對id設定動作， id在頁面中只允許出現一次。
對於CSS樣式來說，可以選取頁面中所有id=box的DOM物件：
#box {
color: red;
};jQuery選擇器的寫法和CSS選擇器十分類似，但是功能卻不同：
CSS找到元素後面加入的是單一樣式，而jquery添加的是動作行為。
以上是詳談JQuery中id選擇器和class選擇器的差別於聯繫的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn