JS DOM对象 getAttribute()方法 通过元素节点的属性名称获取属性的值。 语法: elementNode.getAttribute(name)

etAttribute()方法

通过元素节点的属性名称获取属性的值。

语法:

elementNode.getAttribute(name)

说明:

1. elementNode:使用getElementById()、getElementsByTagName()等方法,获取到的元素节点。

2. name:要想查询的元素节点的属性名字

看看下面的代码,获取h1标签的属性值:

JS DOM对象 getAttribute()方法 通过元素节点的属性名称获取属性的值。 语法: elementNode.getAttribute(name)_第1张图片

运行结果:

h1标签的ID :alink
h1标签的title :getAttribute()获取标签的属值

 

任务

试一试,使用getAttribute()方法,完成下面的任务:

在第20行补充代码,使用getAttribute()方法,获取LI标签的title值


<!DOCTYPE html>
<html>
 <head>
 <meta charset="utf-8">
 <title></title>  
 
 </head>
<body>
  <p id="intro">课程列表</p>
		<ul>
				<li title="第一个li">HTML</li>
				<li >HTML</li>
				<li title="第三个li">CSS</li>
				<li title="第四个li">JS</li>
				<li title="第五个li">JQ</li>
		</ul>
<p>以下为获取的不为空的li标签的title值:</p>

<script type="text/javascript">
		var con = document.getElementsByTagName("li");
		for(var i=0; i<con.length; i++){
				text = con[i].getAttribute("title");
				if(text!=null){
						document.write(text+"<br>");
				}
		}
 </script> 
</body>
</html>

JS DOM对象 getAttribute()方法 通过元素节点的属性名称获取属性的值。 语法: elementNode.getAttribute(name)_第2张图片


你可能感兴趣的:(JavaScript,dom,对象,web前端)