JavaScript點選按鈕刪除一個div元素
本章節分享一段程式碼例項,它實現了點選按鈕刪除一個div元素的功能。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>CSS學習-螞蟻部落</title> <style type="text/css"> div { width:200px; height:100px; background:#ccc; } </style> <script> window.onload = function () { var odiv = document.getElementsByTagName("div")[0]; var obt = document.getElementById("bt"); obt.onclick = function () { odiv.parentNode.removeChild(odiv) } } </script> </head> <body> <div></div> <input type="button" id="bt" value="檢視效果"/> </body> </html>
上面的程式碼實現了我們的要求,下面介紹一下它的實現過程。
相關閱讀:
(1).getElementsByTagName()參閱document.getElementsByTagName()一章節。
(2).parentNode參閱JavaScript parentNode一章節。
(3).removeChild()參閱JavaScript removeChild()一章節。
相關文章
- JavaScript點選按鈕刪除div元素JavaScript
- jQuery點選按鈕刪除div元素jQuery
- JavaScript點選一個按鈕隱藏和顯示divJavaScript
- 點選按鈕彈出一個居中div
- JavaScript 點選一個按鈕 div的隱藏和顯示JavaScript
- 點選刪除按鈕彈出是否刪除提示框
- JavaScript新增一個文字框並帶有刪除按鈕JavaScript
- 點選刪除按鈕刪除當前行程式碼例項行程
- 刪除按鈕點選後的虛線輪廓
- 原生javascript如何刪除一個元素節點物件JavaScript物件
- JavaScript 點選按鈕返回底部JavaScript
- JavaScript動態新增和刪除div元素JavaScript
- 點選按鈕實現隱藏一個元素程式碼例項
- JavaScript刪除陣列第一個元素JavaScript陣列
- jquery點選按鈕顯示和隱藏DIvjQuery
- 如何點選一個按鈕實現列印
- JavaScript點選按鈕返回底部詳解JavaScript
- JavaScript點選按鈕彈出層效果JavaScript
- JavaScript刪除陣列最後一個元素JavaScript陣列
- JavaScript 刪除陣列最後一個元素JavaScript陣列
- 點選按鈕動畫方式隱藏和顯示div動畫
- 是否應該在未選中行時禁用刪除按鈕,還是應該在點選按鈕時提示選擇資料?
- 點選一個按鈕使其樣式發生變化,再點選另一個按鈕發生同樣變化,但上一個按鈕樣式復原
- JavaScript點選按鈕數字加1效果JavaScript
- JavaScript點選按鈕切換背景顏色JavaScript
- 點選按鈕實現div的顯示和隱藏
- javascript刪除元素節點removeChild()函式JavaScriptREM函式
- 自定義view之寫一個帶刪除按鈕的EdittextView
- div按鈕CSSCSS
- JavaScript刪除元素節點程式碼例項JavaScript
- javascript 點選回車相當於點選按鈕程式碼例項JavaScript
- 點選同一按鈕實現div的隱藏與顯示切換
- JavaScript刪除陣列元素JavaScript陣列
- JavaScript 建立和刪除元素JavaScript
- JavaScript點選新增行或者刪除行JavaScript
- 點選按鈕顯示或者隱藏元素例項程式碼
- JavaScript radio按鈕選中值JavaScript
- 使用jQuery刪除一個元素節點程式碼例項jQuery