<!DOCTYPE html>
<html>
<head>
<title>HTML文档(Dom)对象模型</title>
</head>
<body>
<!-- 当王爷被加载时，浏览器会自动创建页面的文档对象类型 -->
<!-- 可以改变html元素的内容(操作html的元素内容) -->
<!-- 改变html -->
<!-- 改变html的输出流 -->
<!-- 查找html元素：
1.通过ID来查找：document.getElementById('id名')
2.通过class来查找：document.getElementByClassName('class名')
3.通过标签名（tga name）来查找 document.getElementByTagName('标签名')
-->
<!-- 改变html的内容
使用innerHTML="我是添加的内容" -->
<div id="box" style="backgroung:#ccc; width:100px; height:100px;" onclick="box_1(this)"></div>
<img src="图片路径1" id="pic" onclick="box_2(this)">
<script type="text/javascript">
function box_1(x){
document.getElementById('box').innerHTML="我是添加的内容"
}
// 改变html的属性
// document.getElementById('id').属性名="属性值"
function box_2(x){
document.getElementById('pic').src="图片路径2"
}
</script>
</body>
</html>
博客列表 >【HTML文档(Dom)对象模型】-JavaScript
【HTML文档(Dom)对象模型】-JavaScript
- 迷途何必知返原创转载
- 2018年11月06日 20:06:14771浏览
声明：本文内容转载自脚本之家，由网友自发贡献，版权归原作者所有，如您发现涉嫌抄袭侵权，请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言，请遵守新闻评论服务协议
