JavaScript方法之getAttribute()和setAttribute()方法
2017-03-30 10:25
127 查看
getAttribute()方法：通过元素节点的属性名称获取属性的值
语法：elementNode.getAttribute(name),,,,,elementNode:使用getElementById、getElementsByTagName()等方法获取到的元素节点；name:要想查询的元素节点的属性名字，例如;
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=gbk"/>
<title>getAttribute</title>
</head>
<body>
<input type="button" id="alink" title="gteAttribute()获取标签的属值" onclick="hattr()" value="点击我获取标签的属值">
<script type="text/javascript">
function hattr()
{
var anode=document.getElementById("alink");
var attr1=anode.getAttribute("id");
var attr2=anode.getAttribute("title");
document.write("h1的标签的ID：" +attr1+"<br/>");
document.write("h1标签的title："+attr2);
}
</script>
</body>
</html>
setAttribute()方法：增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值
语法：elementNode.setAttribute(name,value),,,,,name:要设置的属性名;value:要设置的属性值，，如果把指定的属性设置为指定的值，如果不存在具有指定名称的属性，该方法将创建一个新的属性，setAttribute()方法只能通过元素节点对象调用函数，例如;
<!doctype html>
<html>
<head>gbk">
<title>无标题文档</title>
</head>
<body>
<p id="intro">我的课程</p>
<ul>
<li title="JS">JavaScript</li>
<li title="JQ">JQuery</li>
<li title="">HTML/CSS</li>
<li title="JAVA">JAVA</li>
<li title="">PHP</li>
</ul>
<h1>以下为li列表title的值,当title为空时，新设置值为"WEB前端技术":</h1>
<script type="text/javascript">
var Lists=document.getElementsByTagName("li");
for (var i=0; i<Lists.length;i++)
{
var text=Lists[i].getAttribute("title");
document.write(text +"<br>");
if(text=="")
{
Lists[i].setAttribute("title","WEB前端技术");
document.write(Lists[i].getAttribute("title")+"<br>");
}
}
</script>
</body>
</html>
语法：elementNode.getAttribute(name),,,,,elementNode:使用getElementById、getElementsByTagName()等方法获取到的元素节点；name:要想查询的元素节点的属性名字，例如;
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=gbk"/>
<title>getAttribute</title>
</head>
<body>
<input type="button" id="alink" title="gteAttribute()获取标签的属值" onclick="hattr()" value="点击我获取标签的属值">
<script type="text/javascript">
function hattr()
{
var anode=document.getElementById("alink");
var attr1=anode.getAttribute("id");
var attr2=anode.getAttribute("title");
document.write("h1的标签的ID：" +attr1+"<br/>");
document.write("h1标签的title："+attr2);
}
</script>
</body>
</html>
setAttribute()方法：增加一个指定名称和值的新属性，或者把一个现有的属性设定为指定的值
语法：elementNode.setAttribute(name,value),,,,,name:要设置的属性名;value:要设置的属性值，，如果把指定的属性设置为指定的值，如果不存在具有指定名称的属性，该方法将创建一个新的属性，setAttribute()方法只能通过元素节点对象调用函数，例如;
<!doctype html>
<html>
<head>gbk">
<title>无标题文档</title>
</head>
<body>
<p id="intro">我的课程</p>
<ul>
<li title="JS">JavaScript</li>
<li title="JQ">JQuery</li>
<li title="">HTML/CSS</li>
<li title="JAVA">JAVA</li>
<li title="">PHP</li>
</ul>
<h1>以下为li列表title的值,当title为空时，新设置值为"WEB前端技术":</h1>
<script type="text/javascript">
var Lists=document.getElementsByTagName("li");
for (var i=0; i<Lists.length;i++)
{
var text=Lists[i].getAttribute("title");
document.write(text +"<br>");
if(text=="")
{
Lists[i].setAttribute("title","WEB前端技术");
document.write(Lists[i].getAttribute("title")+"<br>");
}
}
</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- JavaScript方法之getAttribute()和setAttribute()方法
- javascript中的setAttribute()方法的使用（兼容性）
- Javascript之getAttribute()方法 setAttribute()方法
- Javascript兼容性之——getAttribute(),setAttribute()（获取设置属性）
- HttpServletRequest类既有getAttribute()方法，也有getParameter()方法，有setAttribute()方法，而没有setParameter()方法
- servlet session的setAttribute(),getAttribute()方法注意 点
- JavaScriPt中的getAttribute()方法
- 关于用javascript改变class所用的setAttribute()方法
- javascript中setAttribute、getAttribute 在不同浏览器上的不同表现
- 关于用javascript改变class所用的setAttribute()方法
- getAttribute 和setAttribute 的使用方法
- 关于用javascript改变class所用的setAttribute()方法
- 通过request的getAttribute方法取不到setAttribute过的值
- DOM方法(getElementById, getElementsByTagName, getAttribute, setAttribute)
- javascript中setAttribute()和getAttribute()、removeAttribute()的使用
- 关于用javascript改变class所用的setAttribute()方法
- 有关getAttribute()方法和setAttribute()方法的说明
- 有关getAttribute()方法和setAttribute()方法的说明
- 有关getAttribute()方法和setAttribute()方法的说明
- js getAttribute()和setAttribute()方法