function insertRow(){
var tr = document.createElement("tr")
var table = document.getElementsByTagName("table")[0]
var td1 = document.createElement("td")
tr.insertBefore(td1,null)
td1.innerHTML = "001"
var td2 = document.createElement("td")
tr.insertBefore(td2,td3)
td2.innerHTML = "孙悟空"
var td3 = document.createElement("td")
tr.appendChild(td3)
td3.innerHTML ="男"
table.appendChild(tr)
document.body.appendChild(table) //少了document
}
function deleteRow(){
var tr = document.getElementsByTagName("tr") //主要是这里少了个document 导致不能删除
var table = document.getElementsByTagName("table")[0]
table.removeChild(tr[tr.length-1])
}
1、添加节点append方法栗子:为body添加一个内容为sss的文本节点
document.body.appendChild(document.createTextNode("sss"))
2、移除节点,removeChild移除某个节点的子节点
栗子:
var ccn=document.getElementById("sd").childNodes[0]//获取到要移除的节点
document.getElementById("sd").removeChild(ccn)//将id为sd的第一个子节点移除
3、移动,控制
栗子:将id为sd的节点向右边移动50px
var sdds=document.getElementById("sd")
sdds.style.left=parseInt(sdds.style.left)+50+"px"
<div id='sd' style="position: absoluteleft: 10px">sd</div>
4、创建节点
document.createTextNode("sss")//创建文本节点
document.createElement("p")//创建p节点
5、查找节点
document.getElementById('oo')//根据id查找
document.getElementsByTagName("p")//根据标签名字查找节点
...
思路:
添加:往页面类型是button的input 标签
删除:通过input标签查找所有添加的按钮,移除其中一个
代码示例:
<script>function add(){
var buttons = document.getElementById('buttons')
buttons.innerHTML += ("<input type='button' value='新1'/>")
}
function del(){
var buttons = document.getElementById('buttons')
var inputs =buttons.getElementsByTagName('input')
if(inputs.length>0){
inputs[0].remove()
}
}
</script>
</head>
<body>
<div id='buttons'>
</div>
<input type='button' value='添加' onclick='add()'/>
<input type='button' value='删除' onclick='del()'/>
</body>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)