html标签嵌套规则
2010-12-16 10:37
447 查看
最
近需要修改一个管理系统,一段用到insertAdjacentHTML的javascript代码有奇怪的表现,最后在论坛上得到答案是管理系统的
HTML代码没有遵守标签嵌套规则,具体是以前的代码中在ul标签下嵌套了div,但这是不允许的,根据嵌套规则,ul中只能嵌套li标签,在li标签中
可以嵌套div标签。
在http://www.cs.tut.fi/~jkorpela/html/nesting.html找到了一份很明了的嵌套规则,贴在下面:
(Note that by
XHTML
rules, element names must be written in
lower case, e.g.
, not
.)
A lowercase word is a term which
describes a collection of HTML elements.
Each entry is followed by a list of elements which
may appear within the elements specified by the entry.
If there is no such list, no nested elements are allowed.
This means that only text (#PCDATA, see next item) is allowed inside
the element; but if the note (empty)
is given, it means that
no content whatsoever is allowed.
However, for flow
, inline
,
block
,
OBJECT
, and BODY
the allowed contents are described separately under the main entries for them.
#PCDATA
means "parsed character data", which is plain text
(without HTML tags,
but "escape sequences
"
such as
and
are allowed)
CDATA
means "character data", which is plain text where even
"escape sequences" aren't interpreted;
for a much better explanation, see the article
CDATA Confusion
by Joe English
excluding
... means that the element must not contain
any of the listed elements, directly or indirectly.
HEAD
TITLE (required)
SCRIPT, STYLE
CDATA
ISINDEX, BASE, META, LINK (empty)
OBJECT
(see content model below)
BODY
INS, DEL (special rules
apply)
flow
flow
block
P, H1, H2, H3, H4, H5, H6
inline
UL, OL
LI
flow
DIR, MENU
LI
inline exluding block
DL
DT
inline
DD
flow
PRE
inline excluding
IMG, OBJECT, APPLET, BIG, SMALL, SUB, SUP, FONT, BASEFONT
DIV, CENTER, BLOCKQUOTE, IFRAME
flow
NOSCRIPT
flow
NOFRAMES
flow
FORM
flow excluding an enclosed FORM
ISINDEX,
HR (empty)
TABLE
CAPTION
inline
COLGROUP
COL (empty)
COL (empty)
THEAD, TBODY, TBODY
TR
TH, TD
flow
ADDRESS
inline
P
inline
FIELDSET
#PCDATA
flow
LEGEND
inline
inline
#PCDATA
TT, I, B, U, S, STRIKE, BIG, SMALL, FONT,
EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, ACRONYM,
SUB, SUP, Q, SPAN, BDO
inline
A
inline excluding an enclosed A element
OBJECT
, APPLET
PARAM (empty)
flow
IMG, BASEFONT, BR (empty)
SCRIPT
CDATA
MAP
AREA (empty)
block
INPUT (empty)
SELECT
OPTGROUP
OPTION
OPTION
TEXTAREA
LABEL
LABEL excluding enclosed LABEL
BUTTON
flow excluding A, INPUT, SELECT, TEXTAREA, LABEL, BUTTON,
FORM, ISINDEX, FIELDSET, IFRAME
HEAD
(content model as above)
FRAMESET
FRAMESET (note recursion)
FRAME (empty)
NOFRAMES
BODY
(see content model above) excluding NOFRAMES
In HTML 4.01 Frameset, the content model for NOFRAMES
applies inside the BODY too, instead of the content model for NOFRAMES
in HTML 4.01 Transitional.
The information here is based on the
DTDs, basically the
transitional DTD
,
in the
1999-12-24 version
of the
HTML 4.01 Specification
.
Note that
XHTML 1.0
is, as its subtitle says,
"A Reformulation of HTML 4 in XML 1.0", so the nesting rules
are the same as in HTML 4.01. However, there are the following
differences that affect the nesting rules:
The content
of
and
elements is
CDATA in HTML 4 but #PCDATA in XHTML.
In XHTML, a
element may have a
element as its direct constituent. In HTML 4.01, that's not
allowed, but note that since the start and end tags of a
element are omissible in HTML 4.01, this is not a big difference.
However, note that when a
element directly contains
a
element, an intervening
element
is implied by HTML 4.01 rules but not
by XHTML rules, and this matters e.g. when you have a style sheet
which uses
as a selector.
Moreover, some of the
restrictions on nesting are expressed
differently;
due to metalanguage differences, some limitations are described in prose
only in the XHTML specification, and this implies that a
validator
will not catch such violations of the limitations
when validating against XHTML DOCTYPE but will catch them when an
HTML DOCTYPE is used.
See section
Differences with HTML 4
in the XHTML 1.0 Specification
.
Date
of last update: 2001-04-06
Interested in related documents? See
a list of documents about WWW
written or recommended by me.
Specifically, this document has a sister:
Allowed nesting of elements in HTML 4 Strict (and XHTML 1.0 Strict)
,
which describes the rules for the Strict versions,
which
include all elements and attributes that have not been deprecated or do not appear in frameset documents.
Jukka Korpela
.
近需要修改一个管理系统,一段用到insertAdjacentHTML的javascript代码有奇怪的表现,最后在论坛上得到答案是管理系统的
HTML代码没有遵守标签嵌套规则,具体是以前的代码中在ul标签下嵌套了div,但这是不允许的,根据嵌套规则,ul中只能嵌套li标签,在li标签中
可以嵌套div标签。
在http://www.cs.tut.fi/~jkorpela/html/nesting.html找到了一份很明了的嵌套规则,贴在下面:
Allowed nesting of elements in HTML 4 (and XHTML 1.0)
Legend
An uppercase word stands for the corresponding element.(Note that by
XHTML
rules, element names must be written in
lower case, e.g.
<html>
, not
<HTML>
.)
A lowercase word is a term which
describes a collection of HTML elements.
Each entry is followed by a list of elements which
may appear within the elements specified by the entry.
If there is no such list, no nested elements are allowed.
This means that only text (#PCDATA, see next item) is allowed inside
the element; but if the note (empty)
is given, it means that
no content whatsoever is allowed.
However, for flow
, inline
,
block
,
OBJECT
, and BODY
the allowed contents are described separately under the main entries for them.
#PCDATA
means "parsed character data", which is plain text
(without HTML tags,
but "escape sequences
"
such as
ä
and
ä
are allowed)
CDATA
means "character data", which is plain text where even
"escape sequences" aren't interpreted;
for a much better explanation, see the article
CDATA Confusion
by Joe English
excluding
... means that the element must not contain
any of the listed elements, directly or indirectly.
Nesting rules for HTML 4.01 Transitional
HTMLHEAD
TITLE (required)
SCRIPT, STYLE
CDATA
ISINDEX, BASE, META, LINK (empty)
OBJECT
(see content model below)
BODY
INS, DEL (special rules
apply)
flow
flow
block
P, H1, H2, H3, H4, H5, H6
inline
UL, OL
LI
flow
DIR, MENU
LI
inline exluding block
DL
DT
inline
DD
flow
PRE
inline excluding
IMG, OBJECT, APPLET, BIG, SMALL, SUB, SUP, FONT, BASEFONT
DIV, CENTER, BLOCKQUOTE, IFRAME
flow
NOSCRIPT
flow
NOFRAMES
flow
FORM
flow excluding an enclosed FORM
ISINDEX,
HR (empty)
TABLE
CAPTION
inline
COLGROUP
COL (empty)
COL (empty)
THEAD, TBODY, TBODY
TR
TH, TD
flow
ADDRESS
inline
P
inline
FIELDSET
#PCDATA
flow
LEGEND
inline
inline
#PCDATA
TT, I, B, U, S, STRIKE, BIG, SMALL, FONT,
EM, STRONG, DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, ACRONYM,
SUB, SUP, Q, SPAN, BDO
inline
A
inline excluding an enclosed A element
OBJECT
, APPLET
PARAM (empty)
flow
IMG, BASEFONT, BR (empty)
SCRIPT
CDATA
MAP
AREA (empty)
block
INPUT (empty)
SELECT
OPTGROUP
OPTION
OPTION
TEXTAREA
LABEL
LABEL excluding enclosed LABEL
BUTTON
flow excluding A, INPUT, SELECT, TEXTAREA, LABEL, BUTTON,
FORM, ISINDEX, FIELDSET, IFRAME
Nesting rules for HTML 4.01 Frameset
HTMLHEAD
(content model as above)
FRAMESET
FRAMESET (note recursion)
FRAME (empty)
NOFRAMES
BODY
(see content model above) excluding NOFRAMES
In HTML 4.01 Frameset, the content model for NOFRAMES
applies inside the BODY too, instead of the content model for NOFRAMES
in HTML 4.01 Transitional.
The information here is based on the
DTDs, basically the
transitional DTD
,
in the
1999-12-24 version
of the
HTML 4.01 Specification
.
Note that
XHTML 1.0
is, as its subtitle says,
"A Reformulation of HTML 4 in XML 1.0", so the nesting rules
are the same as in HTML 4.01. However, there are the following
differences that affect the nesting rules:
The content
of
script
and
style
elements is
CDATA in HTML 4 but #PCDATA in XHTML.
In XHTML, a
table
element may have a
tr
element as its direct constituent. In HTML 4.01, that's not
allowed, but note that since the start and end tags of a
tbody
element are omissible in HTML 4.01, this is not a big difference.
However, note that when a
table
element directly contains
a
tr
element, an intervening
tbody
element
is implied by HTML 4.01 rules but not
by XHTML rules, and this matters e.g. when you have a style sheet
which uses
tbody
as a selector.
Moreover, some of the
restrictions on nesting are expressed
differently;
due to metalanguage differences, some limitations are described in prose
only in the XHTML specification, and this implies that a
validator
will not catch such violations of the limitations
when validating against XHTML DOCTYPE but will catch them when an
HTML DOCTYPE is used.
See section
Differences with HTML 4
in the XHTML 1.0 Specification
.
Date
of last update: 2001-04-06
Interested in related documents? See
a list of documents about WWW
written or recommended by me.
Specifically, this document has a sister:
Allowed nesting of elements in HTML 4 Strict (and XHTML 1.0 Strict)
,
which describes the rules for the Strict versions,
which
include all elements and attributes that have not been deprecated or do not appear in frameset documents.
Jukka Korpela
.