當(dāng)前位置：
首頁(yè) >
前端技术
> javascript
>内容正文
javascript
【学习笔记】JS进阶语法一DOM进阶
生活随笔
收集整理的這篇文章主要介紹了
【学习笔记】JS进阶语法一DOM进阶
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
內(nèi)容整理自《從0到1Javascript快速上手》下半部分-進(jìn)階語(yǔ)法篇
示例：為元素設(shè)置屬性
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>Bigmimi</title><script>window.onload = function(){var oBtn = document.getElementById("btn");var oPic = document.getElementById("pic");var flag = true;oBtn.onclick = function(){if (flag){//為元素設(shè)置屬性 obj.attroPic.src = "img/2.jpg";flag = false;}else{//為元素設(shè)置屬性 obj.attroPic.src = "img/1.jpg";flag = true;}};}</script></head><body><input id="btn" type="button" value="變身" /> <br/><img id="pic" src="img/1.jpg" /></body> </html>?示例：移除最后的元素
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>刪除最后一個(gè)</title><script>window.onload = function(){var oBtn = document.getElementById("btn");var oUl = document.getElementById("list");var oLi = oUl.getElementsByTagName("li");var flag = true;oBtn.onclick = function(){//使用nodeType判斷是元素節(jié)點(diǎn)還是文本節(jié)點(diǎn)if (oUl.lastChild.nodeType == 3){oUl.removeChild(oUl.lastChild);oUl.removeChild(oUl.lastChild);}else{oUl.removeChild(oUl.lastChild);}//使用lastElementChild就不需要判斷了//oUl.removeChild(oUl.lastElementChild);if (oUl.lastElementChild.innerText == "楊冪"){document.body.innerHTML = '<img class="pic" src="img/1.jpg" style="boder:1px solid silver"/>';};};}</script></head><body><ul id="list"><li>楊冪</li><li>古力娜扎</li><li>迪麗熱巴</li><li>關(guān)曉彤</li><li>楊紫</li><li>楊迪</li></ul><input id="btn" type="button" value="剔除怪物" /> <br/> </body> </html>ps：文章僅供學(xué)習(xí)娛樂(lè)，不代表任何觀點(diǎn)。
總結(jié)
以上是生活随笔為你收集整理的【学习笔记】JS进阶语法一DOM进阶的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 【学习笔记】JS进阶语法一DOM基础
- 下一篇： 【学习笔记】JS进阶语法一事件基础