首页 > 代码库 > 元素的创建操作
元素的创建操作
<input type="text" id="text" /><input type="button" id="btn" value="add"/><ul id="ul1"></ul>
var otext = document.getElementById("text"); var obtn = document.getElementById("btn"); var oUL = document.getElementById("ul1"); obtn.onclick = function(){ var oLi = document.createElement("li"); var oA = document.createElement("a"); oA.innerHTML = "删除"; oA.href = "javascript:;"; oA.onclick = function(){ oUL.removeChild(this.parentNode); } oLi.innerHTML = otext.value; oLi.appendChild(oA); if( oUL.childNodes[0] ) { oUL.insertBefore(oLi,oUL.childNodes[0]); } else { oUL.appendChild(oLi); } }
appendChild,insertBefore,replaceChild 都是在父元素下操作。
insertBefore操作的时候如果第二个参数(即获取到的元素)不存在,则其他浏览器下会执行appendChild操作来完成,IE下则会报错,因此需要加一个判断,如果这个元素不存在则执行appendChild,存在则正常执行insertBefore。
元素的创建操作
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。