欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

【js】如何使document.write重新加载body的onload事件

程序员文章站 2022-06-04 16:57:43
...

使用场景:

后端接口放回一个转义的html字符串,让其在前端渲染,折腾了好久,先把\r \t \n 转义字符串转义再转义双引号

str = str.replace(/\\r|\\t|\\n/g,"");
str = str.replace(/\\"/g,'"');

返回的html想触发body的onload事件,使用document.write后新的body的onload事件不生效,后来发现需要先document.open() -> document.write() -> document.close() 才生效,核心代码:

document.open();
document.write(str);
document.close();

Document.open() 方法打开一个要写入的文档。

这将会有一些连带的影响。例如:

此时已注册到文档、文档中的节点或文档的window的所有事件监听器会被清除。
文档中的所有节点会被清除。

注意(引用MDN web docs)

当 document.write() 在页面加载后调用,会发生自动的 document.open()调用。

很多年以来,Firefox和IE浏览器会在清除所有节点的同时,将所有Javascript变量等一并清除,但现在已经不采用这一做法。 不要和
window.open() 方法混淆。document.open 可用于重写当前的文档内容或者追加内容, 而 window.open
是提供了打开一个新的窗口的方法,当前的网页文档内容会被保留。由于 window 是一个全局对象,直接调用 open(…) 和
window.open(…) 的效果是一样的。你可以使用 document.close()关闭打开的文档。

所以不写document.open()也可以,但要有document.close(),load事件才会加载