三木社区

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 567|回复: 0
打印 上一主题 下一主题

JavaScript HTML DOM - 改变 HTML 内容

[复制链接]

942

主题

950

帖子

3062

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
3062
跳转到指定楼层
楼主
发表于 2017-9-29 10:49:52 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
本帖最后由 frankxu 于 2017-9-29 11:00 编辑

改变 HTML 内容
修改 HTML 内容的最简单的方法时使用 innerHTML 属性。
如需改变 HTML 元素的内容,请使用这个语法:
  1. document.getElementById(id).innerHTML=新的 HTML
复制代码
本例改变了 <p>元素的内容:实例
  1. <html>
  2. <body>

  3. <p id="p1">Hello World!</p>

  4. <script>
  5. document.getElementById("p1").innerHTML="新文本!";
  6. </script>

  7. </body>
  8. </html>
复制代码
本例改变了 <h1> 元素的内容:实例
  1. <!DOCTYPE html>
  2. <html>
  3. <body>

  4. <h1 id="header">Old Header</h1>

  5. <script>
  6. var element=document.getElementById("header");
  7. element.innerHTML="新标题";
  8. </script>

  9. </body>
  10. </html>
复制代码
实例讲解:
  • 上面的 HTML 文档含有 id="header" 的 <h1> 元素
  • 我们使用 HTML DOM 来获得 id="header" 的元素
  • JavaScript 更改此元素的内容 (innerHTML)


回复

使用道具 举报

Archiver|手机版|小黑屋|三木电子社区 ( 辽ICP备11000133号-4 )

辽公网安备 21021702000620号

GMT+8, 2026-1-19 23:56 , Processed in 0.028142 second(s), 23 queries .

Powered by Discuz! X3.3

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表