一、JavaScript的输出

最新推荐文章于 2024-04-30 16:57:21 发布

Algerjian

最新推荐文章于 2024-04-30 16:57:21 发布

阅读量410

点赞数

分类专栏： JavaScript学习笔记文章标签： javascript html 学习笔记 web前端

本文链接：https://blog.csdn.net/Algerjian/article/details/49966141

版权

JavaScript学习笔记专栏收录该内容

8 篇文章 0 订阅

订阅专栏

一、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 οnclick="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

Algerjian

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
一、JavaScript的输出

一、JavaScript的输出1、操作html元素如需从JavaScript访问某个HTML元素，可以使用document.getElementById(id)方法。使用 "id" 属性来标识HTML元素，并innerHTML来获取或插入元素内容，例如：我的第一个 Web 页面我的第一个段落。document.getElementById("demo").i
复制链接

扫一扫