标签:tag 替换 ddn href not 元素 常用 rem ddt
1、JavaScript中获取元素
常用的获取document中元素的方法:
1) document.getElementById() =》通过元素ID获取文档中特定的元素,如获取 id = "button1" 的按钮 可以写成: var btn = document.getElementById("button1");
2) document.getElementByTagName() =>获取特定标签的元素集合(返回为 NodeList 结果),因为一个document中可能会有多个该tag的元素。
如: var divs = documet.getElementByTagName("div"); 获取文档中所有的div;
divs.length 获取元素个数,divs[0]取得第一个元素
2、动态创建元素并添加到页面中
1)//创建一块文本,并添追加到文档的最末尾
function addText(){
var text = document.getElementById("txtarea").value;
var newText = document.createTextNode(text);
var newPart = document.createElement("P");
newPart.appendChild(newText);
var body = document.getElementsByTagName("body")[0];
body.appendChild(newPart);
return false;
}
2)//创建一个超链接,并指定url
function addLink() {
var linkA = document.createElement("a");
linkA.href = "http://www.baidu.com";
linkA.innerText = "GOTO...";
linkA.title = "goto another url";
var body = document.getElementsByTagName("body")[0];
body.appendChild(linkA);
alert("添加成功!");
}
3)创建一个按钮并指定单击事件
var btnCnt = 0;
function addNewBtn(){
btnCnt += 1;
var btn = document.createElement("input");
btn.type = "button";
btn.value = "new btn" + btnCnt;
btn.id = "btn" + btnCnt;
btn.onclick = newBtnClicked;
var div = document.getElementById("div1");
div.appendChild(btn);
alert("OK");
}
function newBtnClicked() {
alert("New button clicked here");
}
4)删除指定的按钮
function removeBtn(){
if(btnCnt == 0){
alert("No button to delete");
return;
}
var btn = document.getElementById("btn" + btnCnt);
if(btn != null){
document.getElementById("div1").removeChild(btn);
alert("removed");
btnCnt -= 1;
}
else{
alert("Not found btn" + btnCnt);
}
}
注:因为 btn 是在 div 中添加的,因此需要从DIV中删除,而不是直接从document中删除。
5)除了增加、删除外,还可以调用 节点.insertBefor(new,old)的方式在节点的old前面插入新元素;或节点.replace(new ,old)方法替换节点处的元素
标签:tag 替换 ddn href not 元素 常用 rem ddt
原文地址:http://www.cnblogs.com/xtblog/p/6056631.html