BOM的document对象最常用的方法之一是write()或它的兄弟方法writeln()。这两个方法都接受一个参数,即要写入文档的字符串。如您所料,它们之间唯一的区别是writeln()方法将在字符串末尾加一个换行符(n)。
   这两个方法都会把字符串的内容插入到调用它们的位置。这样浏览器就会像处理页面中的常规HTML代码一样处理这个文档字符串。考虑下面的页面:

<html>
      <head>
         <tltle>Document Write Example</title>
      </head>
      <body>
         <h1><script type="text/javascript">document.write("this is a test")</script></h1>
      </body>
   </html>

该页面在浏览器中看来与下面的页面一样:
   <html>
      <head>
         <title>Document Write Example</title>
      </head>
      <body>
         <h1>this is a test</h1>
      </body>
   </html>
   可以使用这种功能动态地引入外部JavaScript文件。例如:

<html>
      <head>
         <title>Document Example</title>
         <script type="text/javascript">
            document.write("<script type=\"text/javascript\" src=\"external.js\">"+"</src"+"ipt");
         </script>
      </head>
      <body>
      </body>
   </html>

这段代码在页面上写了一个<script/>标鉴,将使浏览器像常规一样载入外部JavaScript文件。注意字符串"</script>"被分成两部分("</src"和"ipt>")。

这是必要的,因为每当浏览器遇到</script>,它都假定其中的代码块是完整的(即使它出现在JavaScript字符串中)。假设前面的例子未把"</script>”分成两部分:

<html>
      <head>
         <title>Document Example</title>
            <script type="text/javascript">
               docunment.write("<script type=\"text/javascript\" src=\"external.js\">"+"</script>");     //this will cause a problem
      </head>
      <body>
      </body>
   </html>

浏览器显示如下网页:
   <html>
      <head>
         <title>Document Example</title>
            <script type="text/javascript">
                  document.write("<script type=\"text/javascript\" src=\"external.js\">"
            </script>
            </script>
      </head>
      <body>
      </body>
   </html>
  
   可以看到,忘记把字符串"</script>"分成两部分引起了严重的混乱。首先,在<script/>标签内有个语法错,因为document write()的调用漏掉了闭括号。其次,有两个</script>标签。这就是在使用document.Write()方法把<script/)标签写入页面时一定要把"</script>"字符串分开的原因。

记住,要插入内容属性,必须在完全载入页面前调用write()和writeln()方法。如果任何一个方法是在页面载入后调用的,它将抹去页面的内容,显示指定的内容。

与write()和witeln()方法密切相关的是open()和close()方法。open()方法用于打开已经载入的文档以便进行编写,close()方法用于关闭open()方法打开的文档,本质上是告诉它显示写入其中的所有内容。通常把这些方法结合在一起,用于向框架或新打开的窗口中写入内容,如下所示:

var oNewWin=window.open("about:blank","newwindow","height=150,width=300,top=10,left=10,resizable=yes");

oNewWin.document.open();
   oNewWin.document.write("<html><head><title>New Window</title></head>");
   oNewWin.document.write("<body>This is a new window!</body></html>");
   oNewWin.document.close();

这个例子打开空白页(使用本地的"about:blank"URL),然后写入新页面。要正确实现这一操作,在调用write()前,先调用open()方法。写完后,调用close()方法完成显示。当您想显示无需返回服务器的页面时,这种方法非常有用。

转载于:https://www.cnblogs.com/htys/p/3947708.html

document.write() 和writeln()方法注意事项相关推荐

  1. JavaScript window.document的属性、方法和事件小结

    javascript中window.document的属性.方法和事件的总结,有需要的朋友可参考一下本文章. 属性: Attributes 存储节点的属性列表(只读) childNodes 存储节点的 ...

  2. javascript:document的属性和方法,title,innerHTML,

    document.titile="简介";  //修改文档的标题为"简介" document.body.innerHTML="<p>doc ...

  3. jQuery中append、insertBefore、after与insertAfter方法注意事项

    jQuery中append.appendTo.prepend.prependTo.before.insertBefore.after与insertAfter方法注意事项 这里列的是针对初学jQuery ...

  4. JavaScriptjQuery.document对象属性和方法

    document对象属性和方法 document对象代表浏览器当面窗口或标签中载入的页面. 它的常用属性有: 属性                                           ...

  5. [js] 写一个 document.querySelector 的逆方法

    [js] 写一个 document.querySelector 的逆方法 document.queryNode = function(node){if(node.id){return '#'+ nod ...

  6. pthread-win32库编译及使用方法注意事项

    "该文引用自 CruiseYoung的:pthread-win32库编译及使用方法注意事项 http://blog.csdn.net/fksec/article/details/415179 ...

  7. Document 对象属性及方法小结

    1 Browser对象Window : closedNavigatorScreenHistoryLocation 2 Document集合:window.documentdocument.all[i] ...

  8. Spring如何加载XSD文件(org.xml.sax.SAXParseException: Failed to read schema document错误的解决方法)...

    本文原文连接: http://blog.csdn.net/bluishglc/article/details/7596118 ,转载请注明出处! 有时候你会发现过去一直启动正常的系统,某天启动时会报出 ...

  9. document.querySelector和querySelectorAll方法

    querySelector和querySelectorAll是W3C提供的 新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2. ...

最新文章

  1. STL 队列queue
  2. php自动装载编程,php 类自动载入的方法
  3. 数据结构与算法(C++)– 堆排(Heap Sort)
  4. redmine2.4.2 插件安装
  5. [网络安全自学篇] 二十九.文件上传和IIS6.0解析问题及防御原理(二)
  6. Quibi:我轻轻地咬一口 你最爱的Netflix和TikTok
  7. 关于ubuntu对有线网卡I219-V和无线网卡RTL8723DE 802.11b/g/n的支持问题
  8. 实战经验:Oracle Lost Write Detection机制导致Select产生大量Redo
  9. CSS基础——浮动(float)【学习笔记】
  10. C语言实现简单的计算器(C语言入门1)
  11. js颜色排序动画js特效
  12. 思维导图MindManager2022版下载安装(无序列号)
  13. Python计算化学式相对分子质量(含完整代码)
  14. Android马甲包封装上架
  15. 清越科技将开启申购:预计募资约8亿元,高裕弟为实际控制人
  16. 《2040大预言:高科技引擎与社会新秩序》——第2章 数字化概览2.1 一生中永不停息的视频日记...
  17. (附源码)spring boot学生社团管理系统的设计与实现 毕业设计 151109
  18. OVP过压保护IC高耐压36V,首选钰泰ETA7008/ETA7014
  19. 【机器人】工业机器人如何赋能3C制造升级?工业机器人的16项重要应用;工业机器人的11个知识问答,“业内人”必看!
  20. flink学习笔记(五)

热门文章

  1. LeetCode 5178. 四因数
  2. C-free在编写代码的过程中遇到方向键失灵,回车键失灵,换行失灵,但是可以正常输入的解决办法!!!!!
  3. varnish与squid比较
  4. atoi和itoa函数实现
  5. mysql 建立一棵树_如何存储一颗树到文件或者数据库
  6. 特征向量的辨析(数学,机器学习)
  7. TokenInsight:反映区块链行业整体表现的TI指数较昨日同期下跌0.25%
  8. 今日恐慌与贪婪指数为79 贪婪程度有所上升
  9. 怀俄明州议员Cynthia Lummis:加密监管需要为创新留有空间
  10. 赛锐信息:SAP设计ERP主路线