计算机 · 2021年12月18日 0

xhtml

XHTML 是更严格纯净的HTML代码

XHTML是什么

  • 可扩展超文本标签语言(Extensible HyperText Markup Language)
  • 目标是取代HTML
  • 与HTML 4.01几乎相同
  • 是更严格纯净的HTML版本
  • 作为一种XML应用被重新定义的HTML
  • 一个W3C标准

所有的浏览器都支持XHTML

验证是否符合XHTML标准

为什么要使用XHTML

XML是一种标记化语言,其中所有的东西都要被正确的标记,以产生形式良好的文档。
XML用来描述数据,而HTML用来显示数据。
通过融合HTML和XML的长处,便得到XHTML。

XHTML与HTML之间的差异

先升级至HTML 4.01, 再考虑XHTML。
养成使用小写字母编写HTML代码的习惯,同时不要养成忽略类似标签的坏习惯。

最主要的不同

  • XHTML元素必须被正确地嵌套
  • XHTML元素必须被关闭
  • 标签名必须使用小写字母
  • XHTML文档必须拥有根元素

XHTML语法

编写XHTML语法规则

更多的XHTML语法规则

  • 属性名称必须小写
  • 属性值必须加引号
  • 属性不能简写
  • 用Id属性代替name属性
  • XHTML DTD定义了强制使用的HTML元素

重要的兼容性提示

应该在”/”符号前添加一个额外的空格,以使你的XHTML与当今的浏览器相兼容。

语言属性(lang)

lang属性应用于几乎所有的XHTML元素。它定义元素内部的内容的所用语言的类型。
如果在某元素中使用lang属性,就必须添加额外的xml:lang,像这样:

<div lang="no" xml:lang="no">Heia Norge!</div>

强制使用的XHTML元素

所有XHTML文档必须进行文件类型声明(DOCTYPE declaration)。在XHTML文档中必须存在html、head、body元素,而title元素必须位于head元素中。
下面是一个最小化的XHTML文件模板:

<!DOCTYPE Doctype goes here>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Title goes here</title>
</head>

<body>
</body>

</html>
  • 提示:文件类型声明并非 XHTML 文档自身的组成部分。它并不是 XHTML 元素,也没有关闭标签。
  • 提示:在 XHTML 中, 标签内的 xmlns 属性是必需的。然而,即使当 XHTML 文档中没有这个属性时,w3.org的验证工具也不会提示错误。这是因为,”xmlns=http://www.w3.org/1999/xhtml” 是一个固定的值,即使你没有把它包含在代码中,这个值也会被添加到 标签中。

XHTML定义了三种文件类型声明

3种文档类型声明

  • DTD规定了使用通用标记语言(SGML)的网页的语法。
  • 诸如HTML这样的通用标记语言应该使用DTD来规定应用于某种特定文档中的标签的规则,这些规则包括一些列的元素和实体的声明。
  • 在通用标记语言(SGML)的文档类型声明或DTD中,XHTML被详细地进行了描述。
  • XHTML DTD使用精确的可被计算机读取的语言来描述合法的XHTML标记的语法和句法。

存在三种XHTML文档类型

  • STRICT(严格类型)
  • TRANSITIONAL(过渡类型)
  • FRAMESET(框架类型)

XHTML 1.0的三种XML文档类型

XHTML 1.0 规定了三种XML文档类型,以对应上述三种DTD。

  • XHTML 1.0 Strict
    需要干净的标记,避免表现上的混乱。请与层叠样式表配合使用。
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • XHTML 1.0 Transitional
    当需要利用 HTML 在表现上的特性时,并且当需要为那些不支持层叠样式表的浏览器编写 XHTML 时。
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  • XHTML 1.0 Frameset
    需要使用HTML框架将浏览器窗口分割为两部分或更多框架时。
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

如何升级至XHTML

添加文件类型声明

  • 添加文件类型声明
    将文件类型声明添加至每页的首行:
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

当然可以选用前面的Transitional或者Frameset而不必须是Strict。

  • 小写的标签和属性名
  • 给所有属性加上引号
  • 空标签:hr, br 和 img
    在XHTML中不允许使用空标签(Empty tags)。<hr><br>标签应该被替换为<hr /><br />
    这样做又产生了一个新问题,Netscape 会误读 <br/> 标签。我们不清楚原因所在,不过将之改为 <br />后就没有问题了。认识到这一点后,你需要再一次通过搜索和替换功能对标签进行更改。
    其他一些标签(比如 <img> 标签)也会碰到上述同样的问题。不要使用闭合标签来关闭 <img>,而是要在标签的末端添加 / >

XHTML 验证

通过DTD验证XHTML

XHTML文档根据文档类型声明(DTD)进行验证。只有正确的DTD添加到文件的首行,XHTML文件才会被正确地验证。
严格DTD包含没有被反对使用的或不出现在框架结构中的元素和属性;
过渡DTD包含严格DTD中的一切,外加那些不赞成使用的元素和属性;
框架DTD包含过渡DTD中的一切,外加框架。

XHTML 模块#

XHTML的28种模块:

XHTML标准属性

HTML 标签拥有属性。每个标签的特殊属性均被列于每个标签描述之下。这里列出的属性是通用于每个标签的核心属性和语言属性(有个别例外)。

核心属性(Core Attributes)

以下标签不提供下面的属性:base, head, html, meta, param, script, style, 以及 title。

属性描述
classclass_rule或style_rule元素的类(class)
idid_name元素的某个特定id
style样式定义内联样式定义
title提示文本显示于提示工具中的文本

语言属性(Language Attributes)

以下标签不提供下面的属性:base, br, frame, frameset, hr, iframe, param, 以及script。

属性描述
dirltrrtl
lang语言代码设置语言代码

键盘属性(Keyboard Attributes)##

属性描述
accesskey字符设置访问某元素的键盘快捷键
tabindex设置某元素的Tab次序

XHTML事件属性

窗口事件(Window Events)

仅在body和frameset元素中有效

属性描述
onload脚本当文档被载入时执行脚本
onunload脚本当文档被卸下时执行脚本

表单元素事件(Form Element Events)

仅在表单元素中有效

属性描述
onchange脚本当元素改变时执行脚本
onsubmit脚本当表单被提交时执行脚本
onreset脚本当表单被重置时执行脚本
onselect脚本当元素被选取时执行脚本
onblur脚本当元素失去焦点时执行脚本
onfocus脚本当元素获得焦点时执行脚本

键盘事件(Keyboard Events)

在下列元素中无效:base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style以及title。

属性描述
onkeydown脚本当键盘被按下时执行脚本
onkeypress脚本当键盘被按下后又松开时执行脚本
onkeyup脚本当键盘被松开时执行脚本

鼠标事件(Mouse Events)

在下列元素中无效:base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, title。

属性描述
onclick脚本当鼠标被单击时执行脚本
ondbclick脚本当鼠标被双击时执行脚本
onmousedown脚本当鼠标被按钮按下时执行脚本
onmousemove脚本当鼠标指针移动时执行脚本
onmouseout脚本当鼠标指针移出某元素时执行脚本
onmouseover脚本当鼠标指针悬停于某元素之上时执行脚本
onmouseup脚本当鼠标按钮被松开时执行脚本