学习不止眼前的教程与笔记 还需实践与创新
[设为首页] [加入收藏]

搜索

温馨提示：本处只能搜索图文,搜题目请进题库

首页>>网站建设>>Javascript>>基础教程>>

javascript教程（五） 输出

发布时间：2020-04-05点击：

    Javascript  输出

    在javascript中，没有直接输出的函数或者功能，但是它可以通过以下方式输出数据给用户：

    1、使用 window.alert() 弹出信息框显示数据。

    2、使用 document.write() 方法将数据写到 HTML 文档中。

    3、使用 innerHTML 将数据写入到 HTML 元素中。

    4、使用 console.log() 将数据写入到浏览器的控制台。

    一、alert信息框 

    <!DOCTYPE html>
<html>
<body>
<script>
window.alert('hello');
//也可以写成alert('hello');
</script>
</body>
</html>

    当页面一加载就会弹出Javascript信息框，Javascript信息框的样式随浏览器的不同而不同，下面是QQ浏览器的样式.

    二、Javascript  document.write() 写到HTML文档 

    <!DOCTYPE html>
<html>
<body>
<script>
document.write(“hello mihu”);
</script>
</body>
</html>

    上述Javascript代码的功能就是讲hello mihu 渲染到页面中，就像直接编写在html文档中一样。

    PS：注意该代码会直接替换原有页面的所有内容。

    三、Javascript innerHTML 操作HTML元素 

    <!DOCTYPE html>
<html>
<body>
<p id="demo">我的第一个段落</p>
<script>
document.getElementById("demo").innerHTML = "hello mihu";
</script>
</body>
</html>

    上述Javascript代码的功能是根据HTML标签的ID查找id值为demo的标签，然后向其中插入文本“hello mihu”.

    四、Javascript console.log()写到控制台 

    <!DOCTYPE html>
<html>
<body>
<p>p hello</p>
<script>
console.log(“console hello”);
</script>
</body>
</html>

    PS:想要查看console的数据需要打开浏览器的开发者工具，一般是F12，然后找到控制台选项卡即可打开。

    学习不止眼前的教程与笔记还需实践与创新——小伙伴们块动手试试吧~

赞一个(0)     踩一个(0)    

相关链接

相关推荐

搜索

温馨提示：本处只能搜索图文,搜题目请进题库

图文推荐

热门文章

题库内容推荐