如何正确地在XHTML文档中使用JavaScript和CSS_HTML/Xhtml_网页制作

企鹅博客
企鹅博客
企鹅博客
28925
文章
0
评论
2020年9月17日00:42:51 评论 5 views 1391字阅读4分38秒

在越来越多的网站中,XHTML的使用正以很快的速度替代HTML4,但是,目前一些主流浏览器对XHTML的支持还不是很好,加上一些网页制作者对XHTML和HTML4之间的差异理解不够,使得XHTML在WEB发展上进程变得缓慢。


XHTML是XML而不是HTML

目前,对XHTML的一个主要误解是它是HTML的另外一个版本。造成此误解的一个事实是Microsoft Internet Explorer仅支持MIME格式为text/html的XHTML而不是被推荐的application/xhtml+xml格式。

当一个XHTML页面被以text/html的MIME格式解析时,它和HTML页面没有任何差别,而当它以text/xml或者application/xhtml+xml的MIME格式解析时,它将遵从严格的XML书写和显示规则。

正确的XHTML格式是一个XML程序并且在书写的时候需要按照以下的严格规则:



1.字符 )

2.注释标签( )内容中不能包含两个连续的横杠(--)

3.包含在注释标签( )中的内容将被忽略


style和script内容中的问题

style和script标签内的内容在XHTML被以XML格式(而不是HTML格式)解析时将造成一些不同的差异。

JavaScript中包含了XHTML中不能存在的字符

Javascript的一些特别字符是XHTML的CDATA标签外不能存在的字符。

注意:上面的示例代码并非良好的XHTML格式,因为它使用了XHTML或XML中不允许的标记"
< "


在style和script内容中使用注释

熟悉HTML的作者通常了解,将style和script标签内容放到注释标签内,将在浏览器中隐藏这些内容,但有些浏览器却不能理解它们。

上面的示例说明了如何在浏览器中忽略注释标签内的内容,同时,这个示例还显示了浏览器在处理text/xml格式和application/xhtml+xml格式的内容的区别。

Mozilla 1.1+ / Opera 7

不应用CSS,不执行JavaScript

Netscape 7.0x / Mozilla 1.0.x

不应用CSS,但执行JavaScript

Internet Explorer 5.5+

不显示该文档.(参见:
https://developer.mozilla.org/Ta ... _in_XHTML_Documents )


style和javascript内含有两个连续的横杠(--)

在XHTML页面的JavaScript中使用注释标签进行处理时产生的另一个问题就是JavaScript中会有出现两个连续的横杠(--)的情况:


使用CDATA代替注释

将script标签内的内容放到CDATA块中可以很好地处理注释中出现两个连续的横杠的问题,不过这将使得一些低版本的浏览器不支持它,因为它们不能理解XML。好在,我们可以通过使用JavaScript中的注释符对CDATA块进行注释以达到兼容的目的。


推荐的xhtml与html兼容处理方式

不要在XHTML页面中直接书写style和script,一个好的替代方案是使用外部文件来书写CSS和JavaScript,然后再在XHTML中进行引入。

这个推荐方案看起来非常不错,不管怎样,它使得页面从text/html向application/xhtml+xml转变的过程中,至少在接下来的这些年里不会出现什么问题。

继续阅读
weinxin
欢迎加入中国站长博客之家
本站的所有资源都会上传分享到博客之家,希望大家互相学习交流进步。
原生js实现下拉列表框 html教程

原生js实现下拉列表框

模仿 qq列表点击下拉, js原生实现, 免费源码提供研究,拿去吧!关注PHP中文网给你更多好看的! 代码: <!DOCTYPE HTML> <html> <head&g...
怎样使用javascript Date Format方法 H5教程

怎样使用javascript Date Format方法

这次给大家带来怎样使用javascript Date Format方法,使用javascript Date Format方法的注意事项有哪些,下面就是实战案例,一起来看一下。 方法一: // 对Dat...
Javascript Global对象_基础知识 js教程

Javascript Global对象_基础知识

Global对象 Global对象是ECMAScript中最特别的对象,因为实际上它根本不存在。如果尝试编写下面的代码,将得到错误: 错误消息显示Global不是对象,但刚才不是说Global是对象吗...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: