您的位置:首页 > Web前端 > JavaScript

js添加删除元素

2015-08-06 16:24 639 查看
//通过id获取元素
function $(id){
return document.getElementById(id);
}

//通过标签获取元素
function $Name(tagName){
return document.getElementsByTagName(tagName);
}

//替换标签里面的内容
function replaceMsg(){
var newNode = document.createElement("p");
//创建一个p标签
newNode.innerHTML = "<font>替换后的文字</font>";
//标签添加内容
var oldNode = $Name("p")[0];
//获取body里面第一个p元素
oldNode.parentNode.replaceChild(newNode,oldNode);
//直接替换标签
}

//删除标签
function removeMsg(){
var node = $("p2");
//var nodeBtn = $("remove");也可以清除按钮
node.parentNode.removeChild(node);
//移除标签,或者document.body.removeChild(node);也可以
//执行这条语句将清空body里面的任何元素document.body.removeNode();
}

//在标签前面添加元素
function addbefore(){
var newNode = document.createElement("p");
//创建一个p标签
newNode.innerHTML = "<font>前面添加的元素</font>";
//p标签添加内容
//第二种方法:给p标签添加内容
//var newText = document.createTextNode("前面添加的元素");
//newNode.appendChild(newText);
var oldNode = $("p3");
//目标标签
oldNode.parentNode.insertBefore(newNode,oldNode);
//在目标标签前面添加元素
//也可以document.body.insertBefore(newNode,oldNode);
}

//在标签后面添加元素
function addlast(){
var newNode = document.createElement("p");
newNode.innerHTML = "<font>后面添加的元素</font>";
var oldNode = $("p3");
oldNode.appendChild(newNode);
//document.body.appendChild(newNode);该语句会在body的最后添加元素
}

//全选
//前端<input type="checkbox" onclick="selAll(this);" />全选
function selAll(value){
var items = document.getElementsByTagName("input");
//获取页面上所有input元素
for(var i=0;i<items.length;i++){
if(items[i].type == "checkbox"){
//判断类型是否为checkbox
items[i].checked = value.checked;
}
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: