<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>2019/03/20作业</title>
<script src="js/hw.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
.btn{
background-color: skyblue;
color: white;
}
</style>
</head>
<body>
<input type="button" name="btn1" id="btn1" value="第一题" />
<input type="button" name="btn2" id="btn2" value="第二题" />
<input type="button" name="btn3" id="btn3" value="第三题a" />
<input type="button" name="btn4" id="btn4" value="第三题b" />
<div id = "div1">
<h1 name="title1">div1的标题1</h1>
<a href="http://www.baidu.com"></a>
<p>div1中的内容</p>
<form action="#" id="form1" method="post">
<input type="radio" name="confirm" value="Yes" />是
<input type="radio" name="confirm" value="No" />否
<input type="submit" class="btn" value="提交"/>
</form> </div>
<div id="div2">
<h1 name="title2">div2的标题1</h1>
<p>div2中的内容</p>
<form action="#" id="form2" method="post">
<input type="button" class="btn" value="按钮" />
<input type="submit" class="btn" value="提交"/>
</form>
</div>
</body>
</html>
.html部分
window.onload = function(){
//第一题开始:获取Document对象的两个子节点，并且打印输出它们的节点类型和节点名称，直接获取body元素。
var b1 = document.getElementById("btn1");
b1.onclick=function(){
var cNodes = document.childNodes;
for(var i=0;i<cNodes.length;i++){
alert("文档节点的子节点的NodeType是"+cNodes.item(i).nodeType);
alert("文档节点的子节点的NodeName是"+cNodes[i].nodeName);
}
//直接获取body元素
var boy = document.body;
alert(boy.nodeName);
}
//第一题结束
//第二题开始:写出当前文档信息：标题，完整URL和域名
var b2=document.getElementById("btn2");
b2.onclick=function(){
var title1=document.title;
alert(title1);
var url1=document.URL;
alert(url1);
var yuming=document.domain;
alert(yuming);
}
//第二题结束
//第三题开始
//a:通过id获取div2的节点，并输出它的id（innerHTML）
var b3=document.getElementById("btn3");
b3.onclick=function(){
var dv2=document.getElementById("div2");
alert(dv2.innerHTML);
}
//b)通过tagName获取文档中所有h1标签，并循环显示它的内容。并且通过name的名称，找到name为title1的h1标签，打印它的内容。
var b4=document.getElementById("btn4");
b4.onclick=function(){
var tagb=document.getElementsByTagName("h1");
for(i=0;i<tagb.length;i++){
alert(tagb[i].innerHTML);
}
var h1name=tagb.namedItem("title1");
alert(h1name.innerHTML);
}
//c)通过Name获取名称相同的单选按钮，并循环打印单选按钮的value。
var bt=document.getElementsByName("confirm");
for (var i=0;i<confirm.length;i++){
alert(confirm.item(i).value);
}
//d)直接获取文档中所有的form表单，并打印表单的id。获取所有a链接，并打印a链接的href
var forms=document.forms;
for(i=0;i<forms.length;i++){
alert(forms[i].id);
}
var links=document.links;
for(i=0;i<links.length;i++){
alert(links.item(i).href);
}
//第三题结束
}