JavaScript （三）——JavaScript 输出

最新推荐文章于 2024-07-30 22:36:34 发布

神秘的博主

最新推荐文章于 2024-07-30 22:36:34 发布

阅读量192

点赞数 3

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/m0_62701594/article/details/140808128

版权

JavaScript 没有任何打印或者输出的函数

JavaScript 显示数据

JavaScript 可以通过不同的方式来输出数据：

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

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

使用 innerHTML 写入到 HTML 元素

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

使用 window.alert()

示例：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>
        window.alert("Hello World!");
    </script>
</body>

</html>

运行结果：

操作 HTML 元素

如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。

请使用 "id" 属性来标识 HTML 元素，并 innerHTML 来获取或插入元素内容

示例：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p id="demo">
        111
    </p>
    <script>

        x = document.getElementById("demo");
        x.innerHTML = "Hello JavaScript!";

    </script>
</body>

</html>

运行结果：

写到 HTML 文档

示例：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p id="demo">
        111
    </p>
    <script>
        document.write(Date());

    </script>
</body>

</html>

运行结果：

使用 document.write() 可以向文档写入内容。

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖

写到控制台

可以使用 console.log() 方法在浏览器中显示 JavaScript 值。

浏览器中使用 F12 来启用调试模式，在调试窗口中点击 "Console" 菜单

示例：

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p id="demo">
        111
    </p>
    <script>
        a = 5;
        b = 10;
        c = a + b;
        console.log(c);

    </script>
</body>

</html>

运行结果：