正文
下面的代码中展示了常用的js获取html对象的方法,并且添加了详细的注释说明。快来看看吧。
// 页面加载完毕以后再执行
window.onload=function(){
//1.根据id获取对象
var obj = document.getElementById("tel");
alert(obj.value);
var divobj=document.getElementById("d1");
alert(divobj.innerHTML); //输出对象的innerHTML,双标签中的内容
//2.根据name获取对象,返回的是数组
var arr = document.getElementsByName("sex");
for(var i = 0;i<arr.length;i++){
alert(arr[i].value)
}
//3.根据tagname标签名获取对象,返回的也是数组
var brr = document.getElementsByTagName("p");
for(var i = 0;i<brr.length;i++){
alert(brr[i].innerHTML);
}
// 4.根据class类别名获取对象
var crr = document.getElementsByClassName("news");
for(var i = 0 ; i < crr.length ; i++){
alert(crr[i].innerHTML)
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/index.js"></script>
</head>
<body>
<input id="tel" type="text" value="136"/>
<div id="d1">
aaa<span>111</span>
</div>
<input type="radio" name="sex" value="男"/>男
<input type="radio" name="sex" value="女"/>女
<p>111</p>
<p>111</p>
<p>111</p>
<p>111</p>
<p>111</p>
<div class="news">aaa</div>
<div class="news">bbb</div>
<div class="news">ccc</div>
<div >ddd</div>
</body>
</html>