JavaScript 輸出

在某些情況下，您可能需要從JavaScript代碼生成輸出。例如，您可能想查看變量的值，或向?yàn)g覽器控制臺(tái)寫一條消息，以幫助您調(diào)試正在運(yùn)行的JavaScript代碼中的問題，等等。

在本教程中，您將學(xué)習(xí)如何在JavaScript中生成輸出。

JavaScript生成輸出方法

JavaScript可以不同方式顯示數(shù)據(jù)：

• 寫入HTML元素使用 innerHTML

• 寫入文檔流使用 document.write()

• 彈出警告框，使用 window.alert()

• 寫入瀏覽器控制臺(tái)使用 console.log()

使用innerHTML

您可以使用元素的innerHTML屬性在HTML元素內(nèi)寫入或插入輸出。

但是，在首先寫入輸出之前，我們需要使用諸如getElementById()之類的方法來(lái)選擇元素。

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

使用innerHTML更改元素的HTML內(nèi)容，是在HTML中顯示數(shù)據(jù)的一種常用方法。

使用document.write()

您只能使用document.write()方法將內(nèi)容解析到當(dāng)前文檔中。

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

如果document.write()在頁(yè)面加載后使用此方法，它將覆蓋該文檔中的所有現(xiàn)有內(nèi)容。

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

使用window.alert()

您還可以使用警報(bào)對(duì)話框向用戶顯示消息或輸出數(shù)據(jù)。

使用alert()方法將創(chuàng)建一個(gè)警報(bào)對(duì)話框。

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

使用console.log()

您可以使用console.log()方法輕松地將消息輸出或?qū)?shù)據(jù)寫入瀏覽器控制臺(tái)。

該控制臺(tái)可用于測(cè)試或調(diào)試目的。

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

要訪問Web瀏覽器的控制臺(tái)，請(qǐng)先按F12鍵盤上的鍵以打開開發(fā)人員工具，然后單擊控制臺(tái)選項(xiàng)卡。

您將在本教程的后面部分了解有關(guān)調(diào)試的更多信息。