憤怒的WebAPI(四) 節點

2021-09-01 06:28:08 字數 1507 閱讀 5123

1、節點型別:nodetype

2、節點名:nodename,對於元素節點來說,nodename結果為大寫的標籤名,例如div

3、節點值:nodevalue,對於元素節點來說,nodevalue為null

parentnode,父節點

② childnodes,獲取所有子節點,會獲取到文字節點

children,獲取所有元素子節點(子元素)

④ firstchild,獲取第乙個子節點 -,會獲取到文字節點

⑤ firstelementchild,獲取第乙個元素子節點,相容性問題 ie9以下不支援

⑥ lastchild - 獲取最後乙個子節點,會獲取到文字節點

⑦ lastelementchild,獲取最後乙個元素子節點,相容性問題

① nextsibling,獲取下乙個同級節點 , 會獲取到文字節點

② nextelementsibling,獲取下乙個同級元素節點,相容性問題

③ previoussibling,獲取上乙個同級節點,會獲取到文字節點

④ previouselementsibling,獲取上乙個同級元素節點,相容性問題

① 功能:將引數移動到呼叫的節點中所有子節點的最後

② 引數:要移動的節點

① 引數:布林型別,true表示深拷貝,拷貝標籤和內部內容,預設為false,表示淺拷貝,只拷貝標籤本身

② 要轉殖的元素和內部元素不能設定id

③ 轉殖只是結構操作,無法轉殖事件等內容

宣告的內容會被新增到body的最後位置,如果在頁面載入後使用document.write(),此時頁面中所有內容都會被覆蓋。

頁面在執行後,內部的所有標籤會被自動生成,這個過程我們稱為一次文件流。如果在頁面載入後再次使用document.write(),會開啟乙個新的文件流,這時上一次文件流的內容會被覆蓋。

① 好處:

可以指定位置進行元素的建立操作。

不會對頁面中的所有內容造成覆蓋。

② 缺點:

會覆蓋當前元素內的內容。

使用+=方式雖然可以避免結構的覆蓋,但實際上內部的新舊標籤不是同乙個了,事件等內容均不存在了。

① 用於進行元素節點的建立操作

② 引數:字串形式的標籤名

③ 特點:使用此方式建立的元素預設不在頁面中顯示,如果需要顯示,需要自己進行移動節點操作。

④ 優點:效能好

⑤ 缺點:如果使用document.createelement()進行複雜結構建立時較為繁瑣

① 複雜結構使用innerhtml

② 其他情況下使用document.createelement()

③ 如果要進行元素建立的元素box中已經具有了其他元素,這時必須使用document.createelement()

removechild(); 移除子元素

① 引數:要移除的元素,必須是呼叫元素的子元素

② 返回值:被移除的元素

Web API 學習02 (節點操作)

1 排他思想 運用於京東輪播圖小圓點 如果有一組元素,我們想要某乙個元素實現某種樣式,需要用到迴圈的排他思想演算法 1 先把所有元素全部清除樣式 2 然後給當前元素新增樣式 var imgs document.queryselector box queryselectorall img 是找到類名為...

從零開始學 Web 之 DOM(四)節點

頁面中的所有內容,包括標籤,屬性,文字 文字,空格,回車,換行等 也就是說頁面的所有內容都可以叫做節點。標籤節點 比如 div 標籤,p 標籤等。屬性節點 比如 class,value 等。文字節點 比如閉合標籤中的文字內容。nodetype 節點的型別,它的值有 1,2,3 三種。標籤節點 值為 ...

HRBUST 2189 節點的連線

題目描述 有 n個節點,一開始任意兩個節點都沒有相連,之後有兩種操作 1 將a 節點和b 節點連線起來。2 問從a 節點出發可以直接或間接到達的節點數量。如果 a 節點和 b 節點被連線起來了,那麼從 a可以到達 b,同時從 b也可以到達a。整體思路 一道簡單的並查集 實現如下 include in...