DOM (文档对象模型)是我们有能力访问一个文档中的每个元素。

DOM (文档对象模型)是我们有能力访问一个文档中的每个元素。

如何访问一个元素?

元素必须拥有被定义的 id 属性,且需要一段脚本语言。JavaScript 是浏览器兼容性最好的脚本语言,所以我们使用 JavaScript。

<html>
<body>

<h1 id="header">My header</h1>

<script type="text/javascript">
document.getElementById('header').style.color="red"
</script>

</body>
</html>

这段脚本可改变标题元素的颜色,并生成输出。

My header


如何访问一个图像元素并修改 “src” 属性。

<html>
<body>
<img id=”image” src=”/i/eg_smile.gif” />
<script type=”text/javascript”>
document.getElementById(‘image’).src=”/i/eg_landscape.jpg”
</script>
<p><b>注释:</b>原始图片是一个笑脸,但是上面的脚本把图片改为风景。</p>
</body>
</html>

如何访问并修改一个元素的内容。

<html>
<body>
<h1 id=”header”>旧标题</h1>
<script type=”text/javascript”>
document.getElementById(‘header’).innerHTML=”新标题”
</script>
<p>请注意,原始的文本是“旧标题”。</p>
</body>
</html>
My header

发表评论

电子邮件地址不会被公开。 必填项已用*标注