专属属性指那些专属于某种标签的属性。比如 3499910bf9dac5ae3c52d5ede7383485 标签,有href和target属性。a1f02c36ba31691bcfe87b2722de723b 有src属性; ff9c23ada1bcecdd1a0fb5d5a0f18437有entype以及action属性……
a_element.href 返回当前节点指向的超链接
再来看看较为常用的通用方法:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<style>
.form_style{
color: #5b5b5b;
font-size: large;
}
p {
color: #5b5b5b;
font-size: larger;
}
</style>
</head>
<body>
<form id='first_form' class="form_style" name="cangjingge" >
请选择功法:<br/>
<input type="radio" name="gongfa" value="jysg">九阳神功<br/>
<input type="radio" name="gongfa" value="qkdny">乾坤大挪移<br/>
<input type="radio" name="gongfa" value="khbd">葵花宝典<br/>
<input type="radio" name="gongfa" value="xxdf">吸星大法<br/>
</form>
<p>少侠请三思!!!</p>
<script>
//js演示代码请添加至此
</script>
</body>
</html>
1 element.appendchild(nodename) 向元素添加新的子节点,作为最后一个子节点,并返回该子节点。如需向 html dom 添加新元素,您首先必须创建该元素,然后把它追加到已有的元素上。
js演示代码:
var a=document.getelementbyid('first_form');
var textnode=document.createtextnode("慎重选择");
a.appendchild(textnode)
2 element.getattribute(para) 返回元素节点的指定属性值。
js演示代码:
var a=document.getelementbyid('first_form');
console.log(a.getattribute('name')) //控制台输出name的值
3 element.getattributenode(para) 返回指定的属性节点。
js演示代码:
var a=document.getelementbyid('first_form');
console.log(a.getattributenode('name')) //控制台输出name属性节点
4 element.getelementsbytagname(para) 返回拥有指定标签名的所有子元素的集合。
js演示代码:
var a=document.getelementbyid('first_form');
console.log(a.getelementsbytagname('input')) //控制台输出
5 element.hasattribute(para) 如果元素拥有指定属性,则返回true,否则返回 false。
js演示代码:
var a=document.getelementbyid('first_form');
console.log(a.hasattribute('name')) //控制台输出
6 element.insertbefore(insertnode,appointednode) 在指定的已有的子节点之前插入新节点。
js演示代码:
var a=document.getelementbyid('first_form');
var inputlist=document.getelementsbytagname('input');
var newnode=document.createelement('input');
var newnode2=document.createtextnode('天马流星拳');
var br=document.createelement('br');
newnode.type='radio';
newnode.name='gongfa';
newnode.value='tmlxq';
a.insertbefore(newnode,inputlist[2]);
a.insertbefore(newnode2,inputlist[3]);
a.insertbefore(br,inputlist[3]);
7 element.removeattribute() 从元素中移除指定属性。
js示例代码:
var a=document.getelementbyid('first_form');
a.removeattribute('name');
console.log(a.hasattribute('name'))
8 element.removechild() 从元素中移除子节点。移除的节点虽然不在文档树中了,但其实还在内存中,可以随时被引用。
js示例代码:
var a=document.getelementbyid('first_form');
a.removechild(a.childnodes[3]);
9 element.replacechild(newnode,replacenode) 把指定节点替换为新节点。
10 element.setattribute(attrname,attrvalue) 把指定属性设置或更改为指定值。
js示例代码:
var a=document.getelementbyid('first_form');
a.setattribute('name','shaolinsi');
console.log(a.name)
11 element.setattributenode() 修改指定属性节点
js示例代码:
var a=document.getelementbyid('first_form');
var attr = document.createattribute('id');
attr.value='the_first';
a.setattributenode(attr);
console.log(a.id)
12 nodelist.item() 返回 nodelist 中位于指定下标的节点。
js示例代码:
var a=document.getelementsbytagname('input')
console.log(a.item(2))
以上就是javascript dom对象专属属性实例汇总的详细内容。