返回顶部

JavaScript 输出怎么写

[复制链接]
火龙果Lv.1 显示全部楼层 发表于 2021-11-18 18:02:28 |阅读模式 打印 上一主题 下一主题
  JavaScript没有任何打印或者输出的函数。

  一、JavaScript显示数据

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

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

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

  使用innerHTML写入到HTML元素。

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

  二、使用window.alert()

  你可以弹出警告框来显示数据:

  实例
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<body>

<h1>我的第一个页面</h1>
<p>我的第一个段落。</p>

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

</body>
</html>
 
  三、操作HTML元素

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

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

  实例
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

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

<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>

</body>
</html>

  以上JavaScript语句(在<script>标签中)可以在web浏览器中执行:

  document.getElementById("demo")是使用id属性来查找HTML元素的JavaScript代码。

  innerHTML="段落已修改。"是用于修改元素的HTML内容(innerHTML)的JavaScript代码。

  四、在本教程中

  在大多数情况下,在本教程中,我们将使用上面描述的方法来输出:

  上面的例子直接把id="demo"的<p>元素写到HTML文档输出中:

  五、写到HTML文档

  出于测试目的,您可以将JavaScript直接写在HTML文档中:

  实例
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

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

<script>
document.write(Date());
</script>

</body>
</html>

  请使用document.write()仅仅向文档输出写内容。

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

  实例
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

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

<button>点我</button>

<script>
function myFunction() {
   	document.write(Date());
}
</script>

</body>
</html>

  六、写到控制台

  如果您的浏览器支持调试,你可以使用console.log()方法在浏览器中显示JavaScript值。

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

  实例
[JavaScript] 纯文本查看 复制代码
<!DOCTYPE html>
<html>
<body>

<h1>我的第一个 Web 页面</h1>

<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>

</body>
</html>




回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

达内教育:成立于2002年。致力于面向IT互联网行业,培养软件开发工程师、测试工程师、系统管理员、智能硬件工程师、UI设计师、网络营销、会计等职场人才 达内使命:缔造年轻人的中国梦、缔造达内员工的中国梦 达内愿景:做管理一流的教育公司
  • 商务合作

  • Powered by Discuz! X3.4 | Copyright © 2002-2024, 达内教育 Tedu.cn
  • 京ICP备08000853号-56 |网站地图