<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
/**
* xml 侧重存储数据
* html 侧重展示数据,信息 html文件可以看成一个文档,这个文档就是一个对象
* 文档中的舍友标签都可以看成是一个对象
* 页面中每个标签都是一个元素,每个元素都可以看成是一个对象
* 标签可以嵌套
* 元素(element): 页面中所有的标签都是元素,元素都可以看成是对象
* 节点(node) 页面中所以内容都是节点: 标签 属性 文本
* 由文档(document)及文档中的所有的元素组成的一个树形结构图叫树状图(DOM树)
*/
function f1(){
var img=document.getElementById("image");
img.height="300";
img.width="400";
img.src="img/im1.jpg";
}
</script>
</head>
<body>
<input value="buttonImg" id="btn1" type="button" onclick="f1()" />
<input value="buttonP" id="btn2" type="button" />
<input value="buttonA" id="btn3" type="button" />
<input value="buttonA" id="btn4" type="button" />
<img src="" alt="图片不显示时展示的文字" title="鼠标移动到图片上时提示的文字" id="image" />
<p id="p1"></p>
<div id="dv1">
<p id="p2">123456789</p>
<p id="p2">123456789</p>
<p id="p2">123456789</p>
<p id="p2">123456789</p>
</div>
<div id="dv2">
<p id="p2">987654321</p>
<p id="p2">987654321</p>
<p id="p2">987654321</p>
<p id="p2">987654321</p>
</div>
<a href="https://www.cnblogs.com/javastu/p/5519569.html." id="a1">博客</a>
<script>
document.getElementById("btn2").onclick=function(){
var p1=document.getElementById("p1");
p1.innerText="dsdsdfsdf";
}
document.getElementById("btn3").onclick=function(){
var a1=document.getElementById("a1");
a1.href="https://www.baidu.com";
a1.innerText="百度";
}
document.getElementById("btn4").onclick=function(){
//返回的是一个伪数组 getElementsByTagName:获取节点p标签
var dv1Obj=document.getElementById("dv1").getElementsByTagName("p");
for(var i=0;i<dv1Obj.length;i++){
dv1Obj[i].innerText="asdfgh";
}
}
</script>
</body>
</html>
day7
最新推荐文章于 2019-12-03 23:46:49 发布