JavaScript物件導向怎樣刪除標籤頁?

　　單擊小標籤右上角的按鈕可D頭刪除標籤頁。其開發思路是，為“x”元素繫結單擊事件，事件觸發後，透過父元素1i獲取索弓引值，然後用這個索引值將對應的li和section刪除，並在刪除後更新標籤頁的選中效電下面我們們就開始進行程式碼編寫。

　　(1)在udeatNode()方法中獲取所有的“x”元素，具體程式碼如下。

　　(2) 在init()方法的for迴圈中，為每個“x”元素繫結單擊事件。

　　在上述程式碼中，第4行程式碼將觸發事件的物件this和事件物件e傳給removeTab0方法。

　　(3)編寫removeTab0事件，實現標籤頁的刪除，具體程式碼如下。

　　在上述程式碼中，由於“x”元素是小標籤li元素的子元素，當“x”被單擊時，會發生冒泡，導致li的單擊事件也觸發，所以需要透過第2行程式碼阻止事件冒泡。

　　(4)在刪除了li和section元素以後，還需要更新標籤頁的選中狀態。有兩種情況，一種是刪除了當前正在顯示的標籤頁，刪除以後，就把上一個標籤頁設為選中狀態;另-種情況是刪除了一個沒有開啟的標籤頁，這個時候原來的選中狀態應該保持不變。為了區分這兩種狀態，可以在刪除了標籤頁以後，判斷當前是否存在已被開啟的標籤頁，如果不存在，說明刪除的是已被開啟的標籤頁，就把上- -個標籤頁設為選中狀態即可，具體程式碼如下。

　　在上述程式碼中，第3行程式碼用來判斷main元素中是否有已被開啟的標籤頁，如果沒有，則執行if中的程式碼。第4行程式碼用來將上一個標籤頁設為選中狀態，在設定前，先判斷是否存在上一個標籤頁，以避免全部關閉的時候程式出錯。

　　(5)透過瀏覽器訪問測試，觀察刪除標籤頁功能是否已經實現。

　　JavaScript物件導向怎樣刪除標籤頁?以上就相關教程內容，希望能夠幫助到大家，如果大家正在學習web前端知識或者是對web前端知識比較感興趣的話，都可以關注小千，後期會分享更多web前端知識。

　　本文來自千鋒教育，轉載請註明出處。