设为首页收藏本站
QQ群289153111QQ群289150574切换到窄版

 找回密码
 立即注册
搜索
热搜: 生活 中国
生活导航»论 坛 导 航 › 生活导航 › 网站技术 › JavaScript向页面输出内容的四种方法
返回列表 发新帖

JavaScript向页面输出内容的四种方法

[复制链接]
admin 发表于 2020-10-28 21:59:39 | 显示全部楼层 |阅读模式
  1. javascript可以通过不同的方式来输出数据
  2. 1.使用window.alert()输出警告框

  4. <!DOCTYPE html>
  5. <html lang="en">
  6. <head>
  7. <meta charset="UTF-8">
  8. <title>弹出框</title>
  9. </head>
  10. <script>
  11. alert("通过弹出框输出内容");
  12. </script>
  13. <body>
  14. </body>
  15. </html>

  17. 2.使用console.log()写入到浏览器的控制台

  19. <!DOCTYPE html>
  20. <html lang="en">
  21. <head>
  22. <meta charset="UTF-8">
  23. <title>通过console向控制台输出内容</title>
  24. </head>
  25. <script>
  26. console.log("通过console向控制台输出了内容")
  27. </script>
  28. <body>
  29. </body>
  30. </html>

  32. 3.使用innerHTML写入到HTML元素

  34. <!DOCTYPE html>
  35. <html lang="en">
  36. <head>
  37. <meta charset="UTF-8">
  38. <title>通过innerHTML方法向页面元素中输出内容</title>
  39. </head>
  40. <script>
  41. function changeContent() {
  42. document.getElementById("demo").innerHTML = "通过innerHTML方法向页面输出了内容";
  43. }
  44. </script>
  45. <body>
  46. <h1 id="demo">我是一个标题</h1>
  47. <button type="button" onclick="changeContent()">更改内容</button>
  48. </body>
  49. </html>

  51. 4.使用document.write()方法将内容写到html文档中

  53. <!DOCTYPE html>
  54. <html lang="en">
  55. <head>
  56. <meta charset="UTF-8">
  57. <title>write输出内容到页面中</title>
  58. </head>
  59. <script>
  60. document.write("hello");
  61. document.write("<h1>通过document.write输出内容</h1>");
  62. </script>
  63. <body>
  64. </body>
  65. </html>
复制代码


回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|手机版|小黑屋|生活导航|生活导航 ( 新ICP备12003026-1号 )

GMT+8, 2024-4-27 15:27 , Processed in 0.072077 second(s), 14 queries .

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

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