收藏
<!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>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
