关于'//<![cdata['和 '//]]>'解答

55 篇文章 0 订阅
36 篇文章 0 订阅

转http://blog.csdn.net/luguo0816/article/details/7217272


<script type='text/javascript'>

//<![CDATA[

code...


//]]>

</script>

'//<![CDATA[' 和 '//]]>'为了兼容支持xml文档和不支持xml(即只支持html文档)文档的浏览器而设计的。

在支持xml文档中虽然用'//'注释掉代码但xml文档中仍可识别出属于xml的代码<![CDATA[  和 ]]>,所以代码中有大于'>'小于'<'之类的特殊字符不会发生错误,因为在xml文档中这些都是特殊字符。

而不支持xml文档中,这些大于小于号就不是特殊字符了,由于<![CDATA[  和 ]]>是xml代码所以不注释掉就会发生错误。

所以上述设计达到了兼容支持xml文档和不支持xml文档的要求。

这个网页是不是xml这要看文档类型声明,如<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<!--

<script type='text/javascript'>

    some code..

</script>

-->

这种方法兼容不支持javascript的浏览器,已经过时了,因为现在现代的浏览器都支持javascript

________________________________________________________________________________________________________________________________

http://book.51cto.com/art/200912/173123.htm

为了避免这样的问题,脚本内容通常会放在HTML注释(<!--和-->)中,这样即使是不支持JavaScript的浏览器,也会直接忽略该段脚本,但是新一代的浏览器则知道要执行该段脚本。

这是一种不正规的用法,但却广为流传。新一代的浏览器大多支持JavaScript特性,并且也能够识别位于HTML注释中的JavaScript代码段。然而,现在一些新的浏览器能够以XHTML方式解释网页,甚至是XML的方式,那么就会忽略所注释的代码段,在这些情况下,JavaScript就会被忽略,而不会被执行。所以,使用HTML注释来"隐藏"JavaScript代码的方式,已经不被推荐。

然而还有另一种"隐藏"代码的方式,那就是使用XML CDATA小节,这是现在所推荐的方法,特别是在XHTML文档中使用脚本代码时。示例1.3在示例1.2的基础上做了一些的修改,改为使用CDATA小节,修改的部分已加粗显示

*****************************************************************************************************************************************************************************************


http://www.cnblogs.com/Silvia/archive/2011/11/25/2263351.html


一、<script>元素

这个元素由Netscape创造并在Netscape Navigator 2中首先实现。后来,这个元素被加入到正式的HTML规范中。HMTL4.01<script>定义了下列5个属性 

 

 

 使用<script>元素的方式有2

1、直接在页面嵌入JavaScript代码

 

<script type="text/javascript">

function sayHi()

{

alert("Hello!");     

}

</script>

     包含在<script>元素内部的JavaScript代码将被从上至下依次解释,在解释器<script>元素内部所有代码求值完毕以前,页面中的其余内容都不会被浏览器加载或显示

     在使用<script>嵌入JavaScript代码时,记住不在要代码中任何地方出现”</script>”字符串,例如,浏览器在加载下面所示代码时就会产生一个错误

<script type="text/javascript">

function sayScript()

{

alert("</script>");  

}

</script>

      因为浏览器遇到字符串"</script>"时,会认为那是结束的</script>标签,而通过把字符串分割为2部分可以解决这个问题,如:

<script type="text/javascript">

function sayScript()

{

alert("</scr"+"ipt>");    

}

</script>

 

2、通过<script>元素包含外部的JavaScript文件

<script type="text/javascript" src="js/login.js"></script>

注:带有src属性的<script>元素不应该在其<script></script>标签之间再包含额外的JavaScript代码

       另外,通过<script>元素的src属性还可以包含来自外部域的JavaScript文件,这一点既使<script>元素倍显强大,又让它备受争议。<script><img>元素非常相似,即它的src属性可以指入当前HTML页面所在的域之外的某个域中的URL,例如

<script type="text/javascript" src="http://www.somewhere.com/afile.js"></script>

 

    这样,位于外部域中的代码也会被加载和解析,就像这些代码位于加载它们的页面中一样。利用这一点可以在必要时通过不同的域来提供JavaScript文件,不过,在访问自己不能控制的服务器上的JavaScript文件则要多加小心,否则文件中的代码随时有可能被替换

 

无论如何包含代码,浏览器都会按照<script>元素在页面中出现的先后顺序对它们依次进行解析,在第一个<script>元素包含的代码解析完成后,第二个<script>包含的代码才会被解析……

 

标签的位置

习惯放于HTML页面的<head>标签中

但这样做有时会引起如<head></head>中的外部JS文件没解析完,延迟期间浏览器窗口空白,或者是JS在执行中,出现空对象异常(原因是HTML元素未加载到页面中),因此现在的WEB应用程序一般都把全部的JS引用放在<body>元素中,放在页面内容的后面。

 

延迟脚本

<script type="text/javascript" src="js/login.js" defer=”defer”></script>

Defer这个属性表示脚本会被延迟到整个页面都解析完毕再运行。实际上与上面介绍的把JS放在页面最底部的效果是一样的。

但不是所有浏览器都支持defer属性,因此建议使用“把JS引用放在<body>元素中,放在页面内容的后面”这个方法

 

XHTML中的用法

     可扩展超文本标记语言,即XHTMLExtensible HyperText Markup Language),是将HTML作为XML的应用而重新定义的一个标准,编写XHTML代码的规则要比编写HTML严格得多,而且直接影响能否在嵌入JavaScript代码时使用<script />标签。以下面的代码块为例,虽然它们在HTML中是有效的,但在XHTML中则是无效的

<script type="text/javascript">

       function compare(a,b)

       {

              if(a<b){

                     alert("a is less than b");

              }else if(a>b){

                     alert("a is greater than b");

              }else{

                     alert("a is equal to b");

              }

       }

 

</script>

 

这是由于a<b中的小于号在XHTML中被当作一个标签的开始,作为标签来讲,小于号后面不能跟空格,因此导致语法错误

解决方法:

1、  用相应的HTML实体(&lt;)替换代码中所有的小于号(<),替换后代码如下

<script type="text/javascript">

       function compare(a,b)

       {

              if(a &lt; b){

                     alert("a is less than b");

              }else if(a>b){

                     alert("a is greater than b");

              }else{

                     alert("a is equal to b");

              }

       }

 

</script>

 

2、  用一个CData片段来包含JavaScript代码,在XHTML(XML)中,CData片段是文档中一个特殊区域,这个区域中可以包含不需要解析的任意格式的文本内容,

<script type="text/javascript">

       function compare(a,b)<![CDATA[

       {

              if(a<b){

                     alert("a is less than b");

              }else if(a>b){

                     alert("a is greater than b");

              }else{

                     alert("a is equal to b");

              }

       }

]]>

</script>

 

在兼容XHTML的浏览器中,这个方法可以解决问题,实际上不少浏览器不兼容XHTML,因而不支持CData片段,怎么办呢?再使用JavaScript注释将CData标记注释掉就可以了:

<script type="text/javascript">

       function compare(a,b)

//<![CDATA[

       {

              if(a<b){

                     alert("a is less than b");

              }else if(a>b){

                     alert("a is greater than b");

              }else{

                     alert("a is equal to b");

              }

       }

//]]>

</script>

这种格式在所有现代浏览器都可以正常使用,它能通过XHTML验证,而且对XHTML之前的浏览器也会平稳退化

 

不推荐使用的语法

<script><!--

       function sayHi(){

              alert("Hello!");     

       }

//--></script>

让不支持<script>元素的浏览器能够隐藏嵌入javascript代码。

由于现在所有浏览器都支持javascript,因此没必要再用这种格式了

 

嵌入代码与外部文件

HTML嵌入javascript代码虽然没有问题,但一般认为最好的做法还是尽可能使用外中文件,优点如下

可维护性-遍及不同HTML页面的javascript代码会造成维护问题,但把所有javascript文件都放在一个文件夹中,维护起来就轻松多了,开发人员因此也能够在不触及HTML标记的情况下,集中精力编辑javascript代码

可缓存-浏览器能够根据具体的设置缓存链接的所有外部JS文件,也就是说,如果有2个页面都使用同一JS文件,这个文件只须下载一次,最终结果就是能够加快页面加载的速度

可适应未来-通过外部文件来包含javascript无须使用前面提到的XHTML或注释hackHTMLXHTML包含外部文件的语法是相同的

 

二、文档模式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

     最初的2种文档模式是:混杂模式(quirks mode)和标准模式(standards mode),这2种模式主要影响CSS内容的呈现,但在某些情况也会影响JavaScript的解释执行。

如果在HTML文档开始处没有文档类型声明,浏览器会默认开启混杂模式,但采用混杂模式不是值得推荐的做法,因为不同浏览器的混杂模式行为差异非常大,如果不使用某些hack技术,跨浏览器的一致性就无法实现

 

三、<noscript>元素

当浏览器不支持JS时,使用<noscript>元素显示替代的内容

<noscript>元素可以包含能够出现在<body>中的任何HTML元素-<script>元素除外

包含在<noscript>元素中的内容只有在浏览器不支持脚本浏览器支持脚本,但脚本被禁用2种情况下才会显示出来,除此外的其他情况下,浏览器都不会呈现<noscript>中的内容

 

四、小结

JavaScript插入到HTML页面中要使用<script>元素,使用这个元素可以把JavaScript嵌入到HTML页面中,让脚本与标记混合在一起;也可以包含外部的JavaScript文件,而我们需要注意的地方有:

1、2种方式都需要把type属性设置为 text/javascript,以表明使用的脚本语言是JavaScript

2、在包含外部JavaScript文件时,必须将src属性设置为指定相应文件的URL,而这个文件即可以是同一服务器上的文件,也可以是其他任何域中的文件

3、所有<script>元素会按照它们在页面中出现的先后顺序依次被解析,只有在解析完前面<script>元素的代码之后,才会开始解析<script>元素中的代码

4、浏览器在呈现后面的页面内容之前,必须先解析前面的<script>元素中的代码,为此,一般将<script>元素放在页面内容之后和</body>标签之前

5、IE中,通过defer属性可以让浏览器呈现完文档之后再执行脚本,虽然defer属性是HTML4.01规定的,但只有IE支持该属性

6、<noscript>元素可以指定在不支持脚本或禁用脚本的浏览器中显示的替代内容,但在启用了脚本的情况下,浏览器不会显示<noscript>元素中的任何内容


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值