04 JS DOM之 直接獲取節點(3種方法)

2021-07-24 23:57:48 字數 1332 閱讀 5648

獲取節點的方法

1. 直接獲取(id/classname/tagname)(主要3種)(本文)

2.間接獲取:訪問關係獲取(4種)下文

案例body:

功能:通過id獲取元素節點。

返回值:是該id所在的標籤物件本身。如果沒有返回null;

呼叫者:只能是document.其他任何元素無權呼叫。

var box2 = document.getelementbyid("box2");

console.log(box2);//輸出整個

功能:通過標籤名獲取元素節點

返回值:是該標籤名所在的標籤物件本身組合組成的陣列,哪怕只有乙個也要放進陣列中。如果沒有,返回空陣列;

呼叫者:任何元素節點(縮小範圍,在自己的標籤下搜尋)和document

var divarr = document.getelementsbytagname("div");

var parr = document.getelementsbytagname("p");

console.log(divarr);

console.log(parr);

功能:通過標籤名獲取元素節點

返回值:是該標籤名所在的標籤物件本身組合組成的陣列,哪怕只有乙個也要放進陣列中。如果沒有,返回空陣列;

呼叫者:任何元素節點(縮小範圍,在自己的標籤下搜尋)和document

注意: ie5,6,7,8 中此方法無效。html5新增的

var divarr = document.getelementsbyclassname("box1");

var parr = document.getelementsbyclassname("p");

console.log(divarr);

console.log(parr);//

另外兩個不常用:忽略…

乙個是name屬性獲取,另乙個是命名空間獲取。

document.getelementsbyname();

document.getelementsbytagnamens();

未完待續…

jsDOM操作之獲取元素

document.getelementbyid idname document.getelementsbytagname tagname 返回乙個集合 類陣列物件 從整個文件獲取 element.getelementsbytagname tagname 從element的後代元素中獲取documen...

react專案之直聘

專案說明 1 此專案是乙個前後臺分離的招聘的spa,包括前端應用和後台應用 2 包括使用者註冊 登入,大神 老闆列表,實時聊天等模組 3 前端 使用了react全家桶 es6 webpack等技術,構建頁面主要是用到了antd mobile庫 4 後端 使用了node express mongodb...

allegro 04 D 直插分立元件封裝製作流程

通孔分立元件主要包括插針的電阻 電容 電感等。本文件將以1 4w的m型直插電阻為例來進行說明。通孔焊盤設計 尺寸計算 英製 設元件直插引腳直徑為 physical pin size,則對應的通孔焊盤的各尺寸如下 physical pin size 16 mil,40 physical pin siz...