JS jQuery選擇器篇

2021-08-29 04:54:03 字數 1340 閱讀 4763

1、getelementbyid  通過id來獲取元素

document.getelementbyid(elementid)  

2、getelementsbyname  通過name屬性獲取元素

document.getelementsbyname(elementname);

3、getelementsbytagname 通過元素名稱(標籤)獲取元素

document.getelementsbytagname (tagname);//div,p,span

4、getelementsbyclassname  通過類樣式名稱獲取元素

document.getelementsbyclassname(classname);//.box

1、queryselector()     根據選擇器獲取元素

document.queryselector(selectors);  //選擇器可以是: id, 類, 型別, 屬性, 屬性值等來選取元素。

queryselector() 方法僅僅返回匹配指定選擇器的第乙個元素

2、queryselectorall()    根據選擇器獲取元素

document.queryselectorall(selectors); //選擇器可以是: id, 類, 型別, 屬性, 屬性值等來選取元素。

queryselectorall()  返回所匹配到的所有元素

1、直接選擇器

$(selectors)  //selectors可以是id、classname、tagname

2、交集選擇器

$("標籤名.類樣式名字")

3、並集選擇器

$("標籤名字,.類樣式名字,#id選擇器")   //用逗號間隔

4、層次選擇器

$("選擇器 選擇器");//$("#dv span")獲取的是div這個父級元素中所有span標籤

$("選擇器》選擇器");//獲取的是div這個父級元素中直接的子元素

$("選擇器~選擇器");//div這個父級元素中後面所有的span兄弟元素

$("選擇器+選擇器");//獲取的是div後面直接的兄弟元素(中間不能隔別的標籤)

5、eq選擇器

$("li:eq(index)") //index為下標,表示下標為index的

6、gt選擇器

$("li:gt(index)")  //index為下標,表示大於index的

7、lt選擇器

$("li:lt(index)")  //index為下標,表示小於index的

8、奇偶選擇器

odd:  下標為奇數//$("li:odd")

even:下標為偶數//$("li:even")

CSS選擇器篇(所有選擇器 )

class 類選擇器 classname 選擇類名為classname的元素 css classname html id id選擇器 idname 選擇id名為idname的元素 idname 選擇所有 萬用字元 element 元素選擇器 div 選擇所有的div元素 p element,elem...

CSS選擇器篇

要想將css樣式應用於特定的html元素,首先需要找到該目標元素。在css中,執行這一任務的樣式規則部分被稱為選擇器 選擇符 標籤選擇器是指用html標籤名作為選擇器,按標籤名分類,為頁面中某一類標籤指定統一的css樣式。其基本語法格式如下 標籤選擇器 可以把某一類標籤全部選擇出來 div span...

jQuery 選擇器篇

jquery選擇器是jquery提供的一組方法,讓我們更加方便的獲取到頁面中的元素。注意 jquery選擇器返回的是jquery物件。特點 jquery選擇器有很多,基本相容了css1到css3所有的選擇器,並且jquery還新增了很多更加複雜的選擇器 序號名稱 用法描述 1id選擇器 id 獲取指...