阅读 346

JavaScript 输出(javascript三种输出方式)

在某些情况下,您可能需要从JavaScript代码生成输出。例如,您可能想查看变量的值,或向浏览器控制台写一条消息,以帮助您调试正在运行的JavaScript代码中的问题,等等。

在本教程中,您将学习如何在JavaScript中生成输出。

JavaScript生成输出方法

JavaScript可以不同方式显示数据:

  • 写入HTML元素使用 innerHTML

  • 写入文档流使用 document.write()

  • 弹出警告框,使用 window.alert()

  • 写入浏览器控制台使用 console.log()

使用innerHTML

您可以使用元素的innerHTML属性在HTML元素内写入或插入输出。

但是,在首先写入输出之前,我们需要使用诸如getElementById()之类的方法来选择元素。

示例

<p id="msg"></p><p id="output"></p><script>document.getElementById("msg").innerHTML = "Hello World";document.getElementById("output").innerHTML = 20 + 30;</script>

测试看看‹/›

使用innerHTML更改元素的HTML内容,是在HTML中显示数据的一种常用方法。

使用document.write()

您只能使用document.write()方法将内容解析到当前文档中。

示例

<script>document.write("Hello world<br>");document.write(20 + 30);</script>

测试看看‹/›

如果document.write()在页面加载后使用此方法,它将覆盖该文档中的所有现有内容。

示例

<script>function myFunc() {
   document.write("<p>test document.write().</p>");
}</script>

测试看看‹/›

使用window.alert()

您还可以使用警报对话框向用户显示消息或输出数据。

使用alert()方法将创建一个警报对话框。

示例

<button onclick="alert('Hello world');">alert</button>

测试看看‹/›

使用console.log()

您可以使用console.log()方法轻松地将消息输出或将数据写入浏览器控制台。

该控制台可用于测试或调试目的。

示例

<script>console.log("Hello world");console.log(20 + 30);</script>

测试看看‹/›

要访问Web浏览器的控制台,请先按F12键盘上的键以打开开发人员工具,然后单击控制台选项卡。

您将在本教程的后面部分了解有关调试的更多信息。


文章分类
代码人生
文章标签
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐