目录
元素与标签：
标签：指用一对<>括起来的标签的总称。
元素：指从开始标签到结束标签的所有代码，元素包含内容多于标签。
具体方法：
一、getElementById（）方法
作用：获取id为指定内容的所有元素。
代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="ttt">
<span>郑州大学</span><i>河南大学</i>
</div>
<!--document-->
<script>
var element = document.getElementById("ttt");//获取HTML元素对应javaS对象
console.log(element);
</script>
</body>
</html>
结果展示：
二、getElementsByClassName（）方法
作用：获取类名为指定内容的所有元素。
代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p class="z">黄河水</p>
<p class="z">长江水</p>
<!--document-->
<script>
var elements = document.getElementsByClassName("z");
console.log(document.getElementsByClassName("z")[0]);
for(var i in elements){
console.log(element[i]);
}
console.log("######################");
for(var i=0;i<elements.length;i++){
console.log(elements[i]);
}
</script>
</body>
</html>
结果展示：
三、getElementsByTagName（）方法
作用：获取标签为指定内容的所有元素。
代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p class="z">黄河水</p>
<p class="z">长江水</p>
<!--document-->
<script>
console.log("######################");
elements = document.getElementsByTagName("p");
for(var i=0;i<elements.length;i++){
console.log(elements[i]);
}
</script>
</body>
</html>
结果展示：
四、getElementsByName（）方法
作用：获取name属性为指定内容的所有元素。
代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<input type="checkbox" name="hobby" />足球<input type="checkbox" name="hobby" />篮球<input type="checkbox" name="hobby" />乒乓球
<script>
console.log("######################");
elements = document.getElementsByName("hobby");
for(var i=0;i<elements.length;i++){
console.log(elements[i]);
}
function tttt(){
var element = document.getElementById("user_name");
console.log(element.value);
}
</script>
</body>
</html>
结果展示：
