JavaScript 輸出
JavaScript 顯示的可能性
JavaScript 可以透過不同的方式“顯示”資料
- 使用
innerHTML寫入 HTML 元素。 - 使用
document.write()寫入 HTML 輸出。 - 使用
window.alert()寫入警告框。 - 使用
console.log()寫入瀏覽器控制檯。
使用 innerHTML
要訪問 HTML 元素，JavaScript 可以使用 document.getElementById(id) 方法。
id 屬性定義 HTML 元素。 innerHTML 屬性定義 HTML 內容
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個網頁</h1>
<p>我的第一個段落</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>
自己動手試一試 »
更改 HTML 元素的 innerHTML 屬性是顯示 HTML 資料的一種常用方法。
使用 document.write()
為了測試目的，使用 document.write() 很方便
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個網頁</h1>
<p>我的第一個段落。</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
自己動手試一試 »
在 HTML 文件載入後使用 document.write()，將刪除所有現有的 HTML
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個網頁</h1>
<p>我的第一個段落。</p>
<button type="button" onclick="document.write(5 + 6)">試試看</button>
</body>
</html>
自己動手試一試 »
document.write() 方法只能用於測試。
使用 window.alert()
您可以使用警告框來顯示資料
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個網頁</h1>
<p>我的第一個段落。</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
自己動手試一試 »
您可以省略 window 關鍵字。
在 JavaScript 中，window 物件是全域性作用域物件。這意味著變數、屬性和方法預設屬於 window 物件。這也意味著指定 window 關鍵字是可選的
示例
<!DOCTYPE html>
<html>
<body>
<h1>我的第一個網頁</h1>
<p>我的第一個段落。</p>
<script>
alert(5 + 6);
</script>
</body>
</html>
自己動手試一試 »
使用 console.log()
為了除錯目的，您可以在瀏覽器中呼叫 console.log() 方法來顯示資料。
您將在後面的章節中學習更多關於除錯的內容。
JavaScript 列印
JavaScript 沒有列印物件或列印方法。
您無法從 JavaScript 訪問輸出裝置。
唯一的例外是您可以在瀏覽器中呼叫 window.print() 方法來列印當前視窗的內容。
示例
<!DOCTYPE html>
<html>
<body>
<button onclick="window.print()">列印此頁面</button>
</body>
</html>
自己動手試一試 »
