XML/HTML/XHTML/DHTML的相互关系
XML(Extensible Markup Language)可扩展标记语言,和HTML类似,都是一种标记语言,还有类似的标记语言有:DHTML和XHTML,先来捋一捋他们的关系:
HTML(HyperText Markup Language)
这个不必多说,网络的通用语言,随着网络的盛行,大行其道。本身是一种文本文件,通过在文本文件中添加标记符来告诉浏览器显示什么内容。因为最初的标准不完善,经过长时间的演化,现在是一个基本上已经算是完全固定的HTML5版本。
HTML因为之前的不断向下兼容,导致结构不够严谨而备受诟病,因此之后一些搞事的程序猿们开始构思一个结构更加严谨的文档标记语言,这个时候XHTML应运而生了。
XHTML(Extensible HyperText Markup Language)
先看一下百度百科上对XHTML的解释1
可扩展超文本标记语言,是一种置标语言,表现方式与超文本标记语言(HTML)类似,不过语法上更加严格。
其实就严谨性来说,XHTML确实相比于HTML严谨了很多,但是随之也产生了跨平台的兼容性问题和无法向下兼容的问题。因此XHTML逐渐被淘汰,只有一些很老的公司在使用这个技术。
DHTML(Dynamic HTML)
DHTML其实相当于HTML加上CSS加上JS,因为DHTML是“动态的”HTML。
XML(Extensible Markup Language)
下面就是我们的主角登场了,因为考虑到数据的严谨性和可调用性,同时要保证能够和前台的HTML进行成功的交互,此时XML就应运而生了(其实XML比XHTML诞生的早很多,在1998年就成为了W3C的推荐标准),XML是各种应用程序之间进行数据传输最常用的工具。
XML的语法
语法注意事项
1.空元素标签都必须用“/”来关闭,如: <br/>
2.所有标签都区分大小写。
3.必须严格嵌套。
4.所有标签的属性都必须用引号括起来。
5.XML有且只有一个根元素。
XML声明
<?xml 版本信息[编码信息][文档独立性信息]?>
如: <?xml version="1.0"?>
注:xml文档声明必须放到文档第一行,且前方不能又任何字符。
文档类型声明(DTD)
命名规范
1.只能以字母,下划线,或冒号开头。
2.不能包含空格。
3.名称中尽量不使用冒号,否则可能出现解析问题。
4.字符中不能有 &
和 <
以及 ]]>
标签,否则会被理解为标记的起始和结束定界符。
字符引用
有些地方必须要用字符时,可用字符的实体或者字符的进制码代替
字符 | 字符引用(十进制) | 字符引用(十六进制) | 预定义实体引用 |
---|---|---|---|
< | < | < | < |
> | > | > | > |
“ | " | " | " |
‘ | ' | ' | ' |
& | & | & | & |
CDATA字段
其内容不被XML处理器解析,所以可以包含任意字符。但是不能有 &
和 <
以及 ]]>
,相当于引用了其中的内容,而该内容不被解析。
格式:<![CDATA[ 任何不想被解析的内容 ]]>
引用
引用css格式:<?xml-stylesheet href="hello.css" type="text/css"?>
引用外部DTD格式:<!DOCTYPE greeting SYSTEM "hello.dtd">
直接写在xml文档内的DTD:1
2
3<!DOCTYPE greeting [
<!ELEMENT greeting (#PCDATA)>
]>
不过,对于css而言,对xml其实并不特别合适,XML的首选样式语言是XSLT (eXtensible Stylesheet Language Transformations)
其引用方式与css类似:<?xml-stylesheet type="text/xsl" href="simple.xsl"?>
注:PCDATA
:被解析的字符数据CDATA
:不会被解析器解析的文本
属性声明
属性通过ATTLIST来进行声明
格式:<!ATTLIST 元素名称 属性名称 属性类型 默认值>
1
2<!ATTLIST payment type CDATA "check">
<payment type="check"/>
XML HTTP Request
讲了半天XML的杂七杂八,其实这玩意儿才是正主。
XMLHttpRequest 对象用于在后台与服务器交换数据。也就是有了他,AJAX,JSON,XMLHttpRequest对象之流才能正常工作起来,实现数据的交换和同步异步传输。
语法如下:1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22<script>
var xmlhttp=new XMLHttpRequest();
//新定义一个XMLHttpRequest对象
xmlhttp.onreadystatechange = state_Change;
//onreadystatechange 是一个事件句柄。它的值 (state_Change) 是一个函数的名称
//当 XMLHttpRequest 对象的状态发生改变时,会触发此函数。
xmlhttp.open("GET",url,true);
//参数提交方式为GET,参数指向一个url,参数为异步请求(true)
xmlhttp.send(null);
//send()方法仅在使用POST传参时使用,故设定为null
function state_Change(){
if(xmlhttp.readyState == 4){ //4表示已装载
if(xmlhttp.status == 200){ //200表示http请求执行成功
//此处可执行代码
} else {
console.log("服务器发生错误")
}
} else {
consolg.log("未成功装载")
}
}
</script>