document.write覆盖问题
1.不会覆盖页面:
如果仅仅是一句js语句:document.writeln('<span id=\'span1\'>嗯,你好</span>');
ps:\'是转义字符,代表'
2.覆盖页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>你好。window.writeln</p>
<script>
document.writeln('<span id=\'span1\'>嗯,你好</span>');
document.write('123');
window.onload=function(){
document.writeln('<span id=\'span1\'>嗯,你好</span>');
}
</script>
</body>
</html>
效果:

我对于为什么会覆盖的认识:
1.之前,是一直加载,写入页面内容。当加载完了,文档流关闭。
2.当加载完成,触发window.onload事件。在例子中onload绑定的函数有:document.write(*****)语句,这会让文档流再次打开【ps:是一个叫open()的方法,该方法会清空当前文档内容,然后再写。写完后调close方法,文档流关闭】,所以就会出现覆盖现象
document.write覆盖问题的更多相关文章
- document.getElementById的简便方式
封装自己的元素获取方法,使元素获取变得简便 注意:1.应该要防止定义的被重写,可将同名的重新定义 2.可将封装的对象置为全局对象,方便使用 通过id查找单个元素 封装方式: //通过id查找单个元 ...
- js坚持不懈之14:不要在文档加载之后使用 document.write()示例
在看w3school的JavaScript教程时,关于文档输出流中有这么一句话:绝不要在文档加载之后使用 document.write().这会覆盖该文档. 不太明白什么意思,找了一个例子: < ...
- 您只能在 HTML 输出流中使用 document.write,啥意思
JavaScript :写入到HTML输出语法 注意:只能在HTML输出中使用,如果在文档已经加载后使用(比如在函数中) 会覆盖到整个文档 <!DOCTYPE html> <htm ...
- html+css复习之第1篇
1. 保证在火狐浏览器字体<12px,苹果横屏的时候字体显示大小还是12px html { background: #fff; -webkit-text-size-adjust: 100%; - ...
- 骚年,看我如何把 PhantomJS 图片的 XSS 升级成 SSRF/LFR
这篇文章实在是太好了,我看了好几篇,所以极力推荐给大家 原文地址 http://buer.haus/2017/06/29/escalating-xss-in-phantomjs-image-ren ...
- Demo—cookie电商购物车
说明:cookie的操作须有域名,简单点说就是需要用发布的方式去访问,查看cookie信息请用开发者模式进入application栏 1.页面布局(结构)(根目录) 商品列表 <!doctype ...
- JavaScript 初学备忘录
JavaScript 是脚本语言 JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编程代码. JavaScript 插入 HTML 页面后,可由所有的现 ...
- 您只能在 HTML 输出流中使用 document.write。如果您在文档已加载后使用它(比如在函数中),会覆盖整个文档。
刚刚接触JS,看到这句话时一时没搞懂,想了终于有了一些眉目,意思就是在文档加载过后,如果我们用比方说按钮的方式重新加载文档,就会把文档都覆盖: 列如: <!DOCTYPE html> &l ...
- JavaScript 覆盖document.createElement 方法 解决window.close在火狐下不兼容问题)
近期项目遇到了问题,有个asp.net web程序仅仅能在IE7 执行.如今xp都淘汰了,大家都用IE8-IE11,因此这个web app也须要升级 适应全部IE版本号.照成IE版本号不兼容的问题主要 ...
随机推荐
- 【转】EDNS
转自:https://www.cnblogs.com/cobbliu/p/3188632.html 随着业务的复杂化和多样化,RFC1035中定义的DNS消息格式和它支持的消息内容已经不足以满足一些D ...
- Unity5.X 新版AssetBundle使用方案及策略
1.概览 Unity3D 5.0版本之后的AssetBundle机制和之前的4.x版本已经发生了很大的变化,一些曾经常用的流程已经不再使用,甚至一些老的API已经被新的API所取代. 因此,本文的主要 ...
- iOS 序列化和反序列化
摘自:http://hi.baidu.com/popln/blog/item/c3dd9302bb37e994d43f7ccb.html 开篇 1到底这个序列化有啥作用? 面向对象的程序在运行的时候会 ...
- qt5 交叉编译
qtbase/mkspecs/linux-arm-gnueabi-g++/qmake.conf 添加 QMAKE_LFLAGS += -Wl,-rpath-link,$$[QT_SYSROOT]/us ...
- 清除的通用样式 css
/*公共样式--开始*/ html, body, div, ul, li, h1, h2, h3, h4, h5, h6, p, dl, dt, dd, ol, form, input, textar ...
- I.MX6_Linux_UART_device&driver_hacking
/****************************************************************************************** * I.MX6_ ...
- 【c++基础】多个txt文件合并到一个文件的几种方式
参考 1.windows命令: 2.linux-command; 完
- ubuntu16.04-caffe安装过程详解-草稿
前言 目前主要模块都是基于深度学习展开的,虽然知道一些深度学习的基础知识,只是皮毛,还没有使用深度学习框架练手甚至深入,故开始着手深度学习的实操和深入学习. 操作步骤 参考 1.Ubuntu16.04 ...
- 王垠:完全用Linux工作 - imsoft.cnblogs
完全用Linux工作,抛弃windows 我已经半年没有使用 Windows 的方式工作了.Linux 高效的完成了我所有的工作. GNU/Linux 不是每个人都想用的.如果你只需要处理一般的事务, ...
- linux搜索命令之find和grep
在使用linux时,经常需要进行文件查找,其中查找的命令主要有find和grep.两个命令是有区的. 区别:(1)find命令是根据文件的属性进行查找,如文件名,文件大小,所有者,所属组,是否为空,访 ...