老生常談jquery id選擇器和class選擇器的區(qū)別
更新時(shí)間：2017年02月12日 13:00:34 投稿：jingxian
下面小編就為大家?guī)硪黄仙Ｕ刯query id選擇器和class選擇器的區(qū)別。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
實(shí)例如下：
<!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>
<div class="box">hello</div>
<div class="box">world</div>
</body>
</html>
$(function(){
alert($('.box').size()); //返回2
});
size() 方法返回DOM對(duì)象的個(gè)數(shù)
<!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>
<div id="box">hello</div>
<div id="box">world</div>
</body>
</html>
$(function(){
alert($('#box').size()); //只能獲得一個(gè)id=box的DOM對(duì)象，返回1
});
即： id是唯一的，即使有多個(gè)id相同的元素，jquery選擇器也只能獲取其中一個(gè) 。所以：想在jquery中對(duì)id設(shè)置動(dòng)作， id在頁面中只允許出現(xiàn)一次。
對(duì)于CSS樣式來說，可以選取頁面中所有id=box的DOM對(duì)象：
#box {
color: red;
};
jQuery選擇器的寫法和CSS選擇器十分類似，但是功能卻不同：
CSS找到元素后添加的是單一樣式，而jquery添加的是動(dòng)作行為。
以上這篇老生常談jquery id選擇器和class選擇器的區(qū)別就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了解決 jQuery 和其他庫的沖突的方法，文中講解非常細(xì)致，代碼幫助大家更好的理解和學(xué)習(xí)，感興趣的朋友可以了解下2020-06-06
jquery中ajax調(diào)用json數(shù)據(jù)的使用說明
jquery里提供了便捷的ajax運(yùn)用，下面總結(jié)我自己的一些經(jīng)驗(yàn)2011-03-03
jquery實(shí)現(xiàn)手機(jī)端單店鋪購物車結(jié)算刪除功能
本文主要介紹了js實(shí)現(xiàn)手機(jī)端單店鋪購物車結(jié)算刪除功能的示例代碼，具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
這篇文章主要介紹了jQuery選擇器源碼解讀（三）：tokenize方法,本文用詳細(xì)的注釋解讀了tokenize方法的實(shí)現(xiàn)源碼,需要的朋友可以參考下2015-03-03
淺談jQuery hover(over, out)事件函數(shù)
下面小編就為大家?guī)硪黄獪\談jQuery hover(over, out)事件函數(shù)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧，祝大家游戲愉快哦2016-12-12
jquery實(shí)現(xiàn)鼠標(biāo)拖拽滑動(dòng)效果來選擇數(shù)字的方法
這篇文章主要介紹了jquery實(shí)現(xiàn)鼠標(biāo)拖拽滑動(dòng)效果來選擇數(shù)字的方法,涉及jQuery鼠標(biāo)事件的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-05-05
Jquery中offset()和position()的區(qū)別分析
這篇文章主要介紹了Jquery中offset()和position()的區(qū)別,實(shí)例分析了offset()與position()的使用的技巧與區(qū)別,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
jQuery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊處心形漂浮的炫酷效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)鼠標(biāo)點(diǎn)擊處心形漂浮的炫酷效果,涉及jQuery事件響應(yīng)及頁面元素屬性動(dòng)態(tài)變換相關(guān)操作技巧,需要的朋友可以參考下2018-04-04
本篇文章主要是對(duì)Jquery獲得控件值的三種方法進(jìn)行了詳細(xì)的總結(jié)介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2014-02-02
基于jQuery的倒計(jì)時(shí)實(shí)現(xiàn)代碼
昨天看了妙味課堂的倒計(jì)時(shí)視頻，自己學(xué)著寫了下，需要的朋友可以參考下2012-05-05