一、JavaScript的输出

一、JavaScript的输出
1、操作html元素
如需从JavaScript访问某个HTML元素,可以使用document.getElementById(id)方法。
使用 "id" 属性来标识HTML元素,并innerHTML来获取或插入元素内容,例如:
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p id="demo">我的第一个段落。</p>
<script>
document.getElementById("demo").innerHTML="段落已修改。";
</script>
</body>
</html>

2、写入到html文档
2.1、JavaScript直接写入html文档
使用document.write()直接向文档输出内容,例如:
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<script>
document.write("这是JavaScript写入的语句");
</script>
</body>
</html>

2.2、如果html文档已完成加载后(有文本内容)执行document.write,整个html页面将被覆盖。例如:
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction() {
    document.write("这是JavaScript写入html的语句,覆盖已有的文本");
}
</script>
</body>
</html>

3、写入控制台(测试,查找减少bug的过程)
可以使用console.log()方法在浏览器中显示JavaScript值,只用F12来打开调试模式,在窗口中打开Console菜单查看。例如:
<!DOCTYPE html>
<html>
<body>
<h1>我的第一个 Web 页面</h1>
<p>
浏览器中(Chrome, IE, Firefox) 使用 F12 来启用调试模式, 在调试窗口中点击 "Console" 菜单。
</p>
<script>
a = 6;
b = 6;
c = a + b;
console.log(c);
</script>
</body>

</html>

本文整理于W3cschool网站,请参考网站:http://www.runoob.com/js/js-tutorial.html

阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/Algerjian/article/details/49966141
个人分类: JavaScript学习笔记
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭