(1)输出到控制台
可以使用console.log()
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
通过F12启动的调试模式,能够在console下看到
(2)操作HTML
获取元素之后,可以通过innerHTML来获得或插入元素属性
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p id="demo">我的第一个段落</p>
<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>
</body>
</html>
innerHTML也就是说获得的标签中间的内容,上面例子中就是“我的第一个段落”这几个字
(3)写到HTML
可以通过document.write()直接在HTML中
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<script>
document.write(Date());
</script>
</body>
</html>
如上写法就是说,HTML加载的时候写入。如果写入响应方法中,那么就是HTML加载完毕再写,这时就会覆盖整个HTML文档
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<button οnclick="myFunction()">点我</button>
<script>
function myFunction() {
document.write(Date());
}
</script>
</body>
</html>