JS獲取HTML DOM元素的方法

2021-10-04 19:28:40 字數 1600 閱讀 5220

一、js獲取dom元素的方法(8種):

1、通過id獲取(getelementbyid);

2、通過name屬性(getelementsbyname);

3、通過標籤名(getelementsbytagname);

4、通過類名(getelementsbyclassname);

5、獲取html的方法(document.documentelement);

document.documentelement是專門獲取html這個標籤的;

6、獲取body的方法(document.body);

document.body是專門獲取body這個標籤的;

7、通過選擇器獲取乙個元素(queryselector);

8、通過選擇器獲取一組元素(queryselectorall)。

二、具體說明:

1、通過id獲取(getelementbyid)

例:document.getelementbyid(『id』);

用法:①上下文必須是document;

②必須傳引數,引數是string型別,是獲取元素的id;

③返回值只獲取到乙個元素,沒有找到返回null。

2、通過name屬性(getelementsbyname):

例:document.getelementsbyname(「name」);

用法:①上下文必須是document。

②必須傳引數,引數是是獲取元素的name屬性。

③返回值是乙個類陣列,沒有找到返回空陣列。

3、通過標籤名(getelementsbytagname):

例:document.getelementsbytagname(「p」);

var odiv = document.getelementbyid(「divid」);

odiv.getelementsbytagname(「p」);

用法:①上下文可以是document,也可以是乙個元素,注意這個元素一定要存在;

②引數是是獲取元素的標籤名屬性,不區分大小寫;

③返回值是乙個類陣列,沒有找到返回空陣列。

4、通過類名(getelementsbyclassname):

用法:①上下文可以是document,也可以是乙個元素;

②引數是元素的類名;

③返回值是乙個類陣列,沒有找到返回空陣列。

5、獲取html的方法(document.documentelement):

用法:document.documentelement是專門獲取html這個標籤的。

6、獲取body的方法(document.body):

用法:document.body是專門獲取body這個標籤的。

7、通過選擇器獲取乙個元素(queryselector):

用法:①上下文可以是document,也可以是乙個元素;

②.引數是選擇器,如:「div .classname」;

③返回值只獲取到乙個元素。

8、通過選擇器獲取一組元素(queryselectorall)

用法:①上下文可以是document,也可以是乙個元素;

②引數是選擇器,如:「div .classname」;

③返回值是乙個類陣列。

原生JS獲取HTML DOM元素

通過id獲取 getelementbyid document.getelementbyid id 通過name屬性 getelementsbyname document.getelementsbyname name 通過標籤名 getelementsbytagname document.getele...

JS獲取HTML DOM元素的方法

1.根據id獲取標籤元素 element.getelementbyid 元素id var box1 document.getelementbyid box1 獲取id為 box1 的元素 console.log box1 2.根據標籤名獲取標籤列表element.getelementsbytagna...

原生JS獲取HTML DOM元素的8種方法

js獲取dom元素的方法 8種 通過id獲取 getelementbyid 通過name屬性 getelementsbyname 通過標籤名 getelementsbytagname 通過類名 getelementsbyclassname 通過選擇器獲取乙個元素 queryselector 通過選擇...