在 console 输入 document.write()会清空原来的内容,但再次执行的时候会在原来的基础上追加。
这是为什么啊?
1
FrankFang128 2016-09-04 01:15:38 +08:00 2
|
2
YuJianrong 2016-09-04 09:46:11 +08:00 via iPhone
document.write()只有在 javascript 首次加载运行的时候执行,如果页面已经加载完毕,执行这个的效果是抹掉整个页面换成 write 的字符串。毕竟你都不知道 write 到什么位置去。
另外带 async 属性的 script 也不能用,用了没有效果。 |
3
FrankFang128 2016-09-04 11:07:40 +08:00
@YuJianrong 按照 MDN 的说话, write 方法必须在一个 open 过的文档里执行,如果没有 open 过,就会帮你 open 。 open 会把当前文档清空。
document.open() document.write(1) document.write(2) document.close() document.write(3) 在控制台试试。 不要看 W3Schools 了。 |
4
FrankFang128 2016-09-04 11:12:36 +08:00
不看 MDN ,谁能猜到有 close 一说。
|
5
FrankFang128 2016-09-04 11:24:29 +08:00
好吧 W3Schools 也介绍 close 了,不错哦。
|
6
cstome OP @FrankFang128 这个我也试过,就是不理解为什么会这样。 MDN 也只是说没有 document.open 就会自动调用。
还有个疑问,页面加载的过程中是不是相当于执行了 document.open()和 document.close()?然后在页面内嵌 document.write()就不会清空内容,后期页面加载后调用就会? |
7
FrankFang128 2016-09-04 14:43:52 +08:00 via Android 2
https://80post.com/reader/posts/156
当你打开一个页面,浏览器会 1. (前面做了很多事情,与本文无关,省略) 2. 调用 document.open() 打开文档 3. document.write(...) 将下载到的网页内容写入文档 4. 所有内容写完了,就调用 document.close() 5. 触发 dom ready 事件( DOMContentReady) 所以你如果在第 4 步之前 document.write(1) 那么你就直接追加内容到当前位置, 如果你在第 4 步之后 document.write(),那么由于 document 已经 close 了,所以必须重新 document.open() 来打开文档,这一打开,内容就被清空了。 不信你可以这样验证一下: 1. 打开 baidu.com 等页面加载完 2. 在控制台运行 document.write(1),会看到页面清空,只有一个 1 3. 再次运行 document.write(1),会发现页面没有清空, 1 变成了 11 ,因为追加了一个 1 4. 运行 document.close(),这时文档就关闭了。 5. 再次运行 document.write(1),你会发现文档又清空了,变成了 1 。 完 |
8
PythonAnswer 2016-09-04 18:22:48 +08:00 via Android
楼上牛逼,完了。
|
9
beilun 2016-09-05 00:05:15 +08:00
@FrankFang128 涨见识了 2333
|
10
wilddog 2016-09-05 08:57:34 +08:00
@FrankFang128 介绍的很清楚!
|