document.write() 和 document.writeln() 区别

document.write()和document.writeln()有什么区别 
解决思路: 
    两者都是JavaScript向客户端输出的方法,对比可知写法上的差别是一个ln--line的简写,换言之,writeln 方法是以行输出的,相当于在 winte 输出后加上一个换行符。 
具体步骤: 
1.打开一个空白窗口。 
window.open() 
2.用 write 方法向空白窗口写入代码。 
document.write("Line 1") 
document.write("Line 1") 
3.用 writeln 方法向空白窗口写入代码。 
document.writeln("Line 1") 
document.writeln("Line 2") 
4.完整代码示例:

with(window.open()){ 
document.write("Line 1") 
document.write("Line 1") 
document.writeln("Line 1") 
document.writeln("Line 2") 
}

注意:两种方法仅当在查看源代码时才看得出区别。 
特别提示 
把上面的代码加入网页中,然后查看弹出窗口的源代码,将会看到: 
Line 1Line 1Line 1 
Line 2

ps:实际上多了空格而已 。没有特别区分。

document.write()和document.writeln()的区别 + 用js写动态select 
解决思路:

两者都是JavaScript向客户端输出的方法,对比可知写法上的差别是一个ln--line的简写,换言之,writeln 方法是以行输出的,相当于在?winte?输出后加上一个换行符。

注意:document.write方法可以用在两方面:在网页载入过程中用实时脚本创建网页内容以及用延时脚本创建本窗口或新窗口的内容.该方法需要一个字符串参数,它是写到窗口或框架中的HTML内容.该字符串参数可以是变量或值为字符串的表达式,写入内容常常包含HTML标记.

记住,载入网页后,浏览器输出流将自动关闭.在些之后任何一个对当前网页的document.write()方法都将打开一个新的输出流,它将清除当前网页输出内容(包括源文档中的任何变是和值).因此,如果希望用脚本生成的HTML内容替换当前网页,就必须把HTML内容连接起来赋给一个变量.这里,使用document.write()来完成写操作.不必清除文档并打开一个新的数据流,一个document.write()调用就OK了.

关于document.write()方法,还需要说明它的相关方法document.close().脚本向窗口(不管是本窗口还是其它窗口)写完内容后必须关闭输出流.在脚本的最后一个document.write() 方法后面.必须确保有document.close()方法.不这样做就不能显示图像和表单.而且,后面调用的任何document.write() 只会将内容追加到网页后,而不会清除现有内容,写入新值

具体步骤:

1.打开一个空白窗口。 
window.open()

2.用 write 方法向空白窗口写入代码。

document.write("Line1") 
document.write("Line1")

3.用 writeln 方法向空白窗口写入代码。

document.writeln("Line1") 
document.writeln("Line2")

4.完整代码示例:

复制代码代码如下:

<script>  with(window.open()){  document.write("Line1")  document.write("Line1")  document.writeln("Line1")  document.writeln("Line2")  }  </script>

注意:两种方法仅当在查看源代码时才看得出区别。 
特别提示:把上面的代码加入网页中,然后查看弹出窗口的源代码,将会看到:

Line1Line1Line1 
Line2

页面效果和源代码如图。

特别说明

总的来说,一般情况下用两种方法输出的效果在页面上是没有区别的(除非是输出到pre或xmp元素内)。

二、document.write()向指定位置写html 
页面初始化时可以正确写在select框内 
但调用时就写在控件外了 ,不知道document.write()能否想改变innerHTML或outerHTML来动态写HTML?以及写的HTML要用来显示该如何处理?

如下:

复制代码代码如下:

<html>  <head></head>  <script type="text/javascript">  function creatOption(){  for(i=0;i<5;i++)  document.write("<option value=‘"+i+"‘>"+i+"</option>");  }  function openWrite(){  var win=window.open();  win.document.write("Line1");  win.document.write("Line1");  win.document.write("<input type=‘text‘ value=‘1234567890‘ />");  win.document.writeln("Line1");  win.document.writeln("Line2");  }  </script>  <body>  <select id="myselect" name="myselect">  <script language="javascript">  creatOption();  </script>  </select>  <input type="button" value="按钮" onclick="openWrite()"/>  </body>  </html>

关于保留格式,测试一下:<script> document.write("<pre>我在pre中不会换行!")document.write("我在pre中不会换行!")document.writeln("我在pre中会换行!")document.writeln("我在pre中会换行!")document.writeln("我在pre中会换行!</pre>") </script>

document.write() 和 document.writeln() 区别

时间: 2024-08-06 03:46:56

document.write() 和 document.writeln() 区别的相关文章

js中的 window.location、document.location、document.URL 对像的区别(转载)

原文:http://www.cr173.com/html/18417_1.html 当我们需要对html网页进行转向的时候或是读取当前网页的时候可以用到下面三个对像: window.location.document.location.document.URL 对当前网页进行跳转 我们先来看看 document 与 window对象: [window 对象]  它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口. [document 对象] 该对象是window和frames对象的一个属性,

document.ready和onload的区别

转载地址:http://blog.csdn.net/zndxlxm/article/details/7404758 页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 用jQ的人很多人都是这么开始写脚本的:      $(function(){           // do something     });其实这个就是jq ready()的简写,他等价于:      $(docum

document.body、document.documentElement和window获取视窗大小的区别

来源:http://www.ido321.com/906.html 在w3school关于window对象的介绍中,介绍了获取浏览器窗口大小的三种方法(浏览器的视口,不包括工具栏和滚动条). 对于Internet Explorer.Chrome.Firefox.Opera 以及 Safari: window.innerHeight – 浏览器窗口的内部高度 window.innerWidth – 浏览器窗口的内部宽度 对于 Internet Explorer 8.7.6.5: document.

document.documentElement和document.body区别

body是DOM对象里的body子节点,即body标签, documentElement 是整个节点树的根节点root, 详细介绍请看本文,感兴趣的朋友可以参考下 区别: body是DOM对象里的body子节点,即 <body> 标签: documentElement 是整个节点树的根节点root,即<html> 标签: 没使用DTD情况即怪异模式BackCompat下: document.documentElement.clientHeight=0 document.body.c

document.documentElement和document.body区别以及获取浏览器的宽高

原文:http://www.jb51.net/article/41410.htm 1.区别: body是DOM对象里的body子节点,即 <body> 标签: documentElement 是整个节点树的根节点root,即<html> 标签: 2.没使用DTD情况即怪异模式BackCompat下: 代码如下: document.documentElement.clientHeight=0document.body.clientHeight=618 使用DTD情况即标准模式CSS1

document.ready和onload的区别——JavaScript文档加载完成事件

文章转自:http://blog.csdn.net/kk5595/article/details/5713209 页面加载完成有两种事件,一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件),二是onload,指示页 面包含图片等文件在内的所有元素都加载完成.(可以说:ready 在onload 前加载!!!) 我的理解: 一般样式控制的,比如图片大小控制放在onload 里面加载; 而:jS事件触发的方法,可以在ready 里面加载; 更多内容戳这里:http://blog.

JS 页面加载触发事件 document.ready和onload的区别

JS 页面加载触发事件 document.ready和onload的区别 document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 用jQ的人很多人都是这么开始写脚本的: $(function(){       // do something }); 例如: $(functi

document.body 和 document.documentElement 的区别

document.body 和 document.documentElement 的区别 : www.cnblogs.com/scy251147/archive/2011/04/10/2011420.html

Document.getElementById 与 $(&#39;#id&#39;)的区别

一直认为jquery中的$("#id")和document.getElementByIdx_x("id")得到的效果是一样的,今天才发现并不是这么一回事,通过测试得到: alert($("#box"))得到的是[object Object] alert(document.getElementById("box"))得到的是[object HTMLDivElement] alert($("#box")[0])