Javascript 輸出

1.Javascripts顯示方案

Javascripts能以不同方式顯示數據

使用 window.alert() 寫入警告框
使用 document.write() 寫入 HTML 输出
使用 innerHTML 寫入 HTML 元素
使用 console.log() 寫入瀏覽器控制台

2.使用 innerHTML

如需訪問 HTML 元素，JavaScript 可使用 document.getElementById(id) 方法。

id 屬性定義 HTML 元素。innerHTML 属性定義 HTML 内容：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>我的段落</p>
    <p id="demo"></p>
    <button onclick="test()">按鈕</button>
    <script>
        function test() {
            document.getElementById('demo').innerHTML = 5 + 6
        }
    </script>
</body>

</html>

3.使用 document.write()

出于測試目的，使用 document.write() 比較方便：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>我的段落</p>

    <script>
        document.write(5 + 7)
    </script>
</body>

</html>

注意：在 HTML 文檔完全加載後使用 document.write() 將删除所有已有的 HTML ：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>我的段落</p>
    <button onclick="document.write(5+6)">按下去所有html都會洗掉</button>

</body>

</html>

4.使用 window.alert()

你能夠使用警告框來顯示數據

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>警告框會顯示數據</p>

    <script>
        window.alert(5 + 6)
    </script>
</body>

</html>

5.使用 console.log()

在瀏覽器中，您可使用 console.log() 方法来顯示數據。(按下F12在案console)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>警告框會顯示數據</p>

    <script>
        console.log(5 + 6)
    </script>
</body>

</html>

Javascript 輸出

1.Javascripts顯示方案

2.使用 innerHTML

3.使用 document.write()

4.使用 window.alert()

5.使用 console.log()

Read more

Javascripts 使用

JavaScript 使用