javascript 标签中指定属性值的更改与获取

适用于基本标签 <input><i><a>等基本标签

引用jQuery,两种方式

使用下面的input标签为例子

<input id="iconid" type='radio' name='iconfont' value="icon" title=''></input>

 

1、使用id标签中的唯一属性,id="iconid"

a、获取input标签中的所有属性,即获取id、type、name、value、title。获取到的所有属性为object数组型,在前台输出打开后可以看到为什么使用下面的attr可以直接获取到指定属性。
$('#iconid’);
b、获取标签中的指定属性title     attr("属性");
$('#iconid’).attr("title");      
c、更改标签的属性值      attr("属性","值");
$('#iconid’).attr("title","我要把这句话赋值给属性title");

 

2、使用标签名字获取属性值以上述<input>标签为例

注此时文本中只有一个input标签。

a、获取input标签中的所有属性,即获取id、type、name、value、title。获取到的所有属性为object数组型,在前台输出打开后可以看到为什么使用下面的attr可以直接获取到指定属性。
$('input’);     
b、获取标签中的指定属性title    attr("属性");
$('input’).attr("title");
c、更改标签的属性值     attr("属性","值");
$('input’).attr("title","我要把这句话赋值给属性title");

 

当然在使用标签名称对属性进行操作时H5文档中会有多个<input>标签,面对这种情况,jQuery提供eq方法进行遍历。

如要对文本中的第2个input标签进行操作,获取该标签的全部属性代码如下
$('input’).eq(1);
获取标签中的指定属性title      attr("属性");
$('input’).eq(1).attr("title");

 

使用原生的JavaScript对标签的属性进行操作

使用下面的input标签为例子

<input id="iconid" type='radio' name='iconfont' value="icon" title=''></input>

 

1、使用id标签中的唯一属性,id="iconid"

//返回对拥有指定 ID 的第一个对象的引用
var iconid= document.getElementById("iconid")
a、获取input标签中的所有属性,即获取id、type、name、value、title。
iconid;
b、获取标签中的指定属性title    getAttribute("属性");  
iconid.getAttribute("title");
c、更改标签的属性值  setAttribute("属性","值");
iconid.setAttribute("title","我要把这句话赋值给属性title");

 

2、使用标签名字获取属性值以上述<input>标签为例

注此时文本中只有一个input标签。

//返回带有指定标签名的对象的集合
var iconid=document.getElementsByTagName("input");
a、获取input标签中的所有属性,即获取id、type、name、value、title。
iconid;
b、获取标签中的指定属性title    getAttribute("属性");  
iconid[0].getAttribute("title");
c、更改标签的属性值     setAttribute("属性","值");
iconid[0].setAttribute("title","我要把这句话赋值给属性title");