JavaScript 显示方案

最新推荐文章于 2024-05-20 17:33:31 发布

围巢111

最新推荐文章于 2024-05-20 17:33:31 发布

阅读量183

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript

本文链接：https://blog.youkuaiyun.com/qq_40817827/article/details/97394083

JavaScript 专栏收录该内容

9 篇文章

订阅专栏

本文介绍JavaScript如何通过window.alert(), innerHTML, document.write(), 和console.log()等方法在网页上显示数据，涵盖警告框、HTML元素内容修改、文档写入及控制台输出。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript 显示方案

JavaScript 能够以不同方式“显示”数据：

使用 window.alert() 写入警告框
alert() 方法用于显示带有一条指定消息和一个确认按钮的警告框

<!DOCTYPE html>
<html>
<body>

<h1>我的第一张网页</h1>

<p>我的第一个段落</p>

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

</body>
</html>

在这里插入图片描述

innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
使用 innerHTML
如需访问 HTML 元素，JavaScript 可使用 document.getElementById(id) 方法。
id 属性定义 HTML 元素。innerHTML 属性定义 HTML 内容：

<!DOCTYPE html>
<html>
<body>

<h2>我的第一张网页</h2>
<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>

在这里插入图片描述

console.log()
在浏览器中，您可使用 console.log() 方法来显示数据。

<!DOCTYPE html>
<html>
<body>

<h1>我的第一张网页</h1>

<p>我的第一个段落</p>

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

</body>
</html>

在这里插入图片描述