宽容他人,放过自己。

JS输出

Posted on By anchoriteFili

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS输出</title>
<!---->
<!--
JavaScript显示数据
JavaScript可以通过不同的方式来输出数据
1. 使用window.alert()弹出警告框
2. 使用document.write()方法将内容写到HTML文档中
3. 使用innerHTML写入到HTML元素
4. 使用console.log()写入到浏览器的控制台
-->

<!--
操作HTML元素
如需从JavaScript访问某个HTML元素,你可以使用
document.getElementById(id)方法。
请使用"id"属性来标识HTML元素,并innerHTML来获取或插入元素内容
-->

</head>
<body>

<h1>我的第一个页面</h1>
<p id="demo">我的第一个段落</p>

<!--使用window.alert()-->
<script>
window.alert(5 + 6);
</script>

<!--
操作HTML元素
getElementById("demo")是使用id属性来查找HTML元素的JavaScript代码
innerHTML = "段落已修改"。用于修改元素的HTML内容的JavaScript代码
-->
<script>
document.getElementById("demo").innerHTML = "修改段落";
</script>

<!--
写到HTML文档
document.write()仅仅向文档输出写内容。
如果在文档已完成加载后执行document.write,整个HTML页面将被覆盖。
-->
<script>
document.write(Date());
</script>

<!--添加按钮点击,添加时间的时候直接覆盖了整个页面,白屏只显示时间-->
<button onClick="myFunction()">点我</button>
<script>
function myFunction() {
    document.write(Date());
}
</script>

<!--
写到控制台
如果您的浏览器支持调试,你可以使用console.log()方法在浏览器中显示
JavaScript值。
浏览器中使用F12来启用调试模式,在调试窗口中点击"Console"菜单。
-->
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>