JavaScript输出
Posted 长颈鹿的脖子
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript输出相关的知识，希望对你有一定的参考价值。
javascript显示能力
JavaScript可以使用不同的方法“显示”数据
- 写入警报框, 使用
window.alert(). - 写入html输出 使用
document.write(). - 写在HTML元素, 使用
innerHTML. - 写入浏览器控制台, 使用
console.log().
使用 window.alert()
可以使用警报框来显示数据:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body>
<h1>我的第一个Web页面</h1>
<p>我的第一个段落.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
使用 document.write()
出于测试目的，使用document.write()更方便 :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body>
<h1>我的第一个Web页面</h1>
<p>我的第一个段落.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>使用document.write()后， HTML文档完全加载，将删除所有现有的HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body>
<h1>我的第一个Web页面</h1>
<p>我的第一个段落.</p>
<button type="button" onclick="document.write(5 + 6)">试试</button>
</body>
</html>
document.write()方法只用于测试.
使用 innerHTML
访问一个HTML元素, JavaScript可以使用 document.getElementById(id) 方法.
id属性定义HTML元素. innerHTML 属性定义HTML内容:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body>
<h1>我的第一个Web页面</h1>
<p>我的第一个段落.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>为了在HTML中"显示数据", (多数情况下) 你可以设置 innerHTML 属性.
使用 console.log()
在你的浏览器，你可以使用console.log()方法显示数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>编程字典</title>
</head>
<body>
<h1>我的第一个Web页面</h1>
<p>我的第一个段落.</p>
<p>
在你的浏览器中打开调试窗口，使用F12，然后选择"Console"菜单项
</p>
<p>再点击运行(run).</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>让我试试
更多教程：http://codingdict.com/article/3131
以上是关于JavaScript输出的主要内容，如果未能解决你的问题，请参考以下文章
VSCode自定义代码片段12——JavaScript的Promise对象