diff --git a/source b/source index a2552c1ab57..d62312c0048 100644 --- a/source +++ b/source @@ -3138,6 +3138,7 @@ a.setAttribute('href', 'http://example.com/'); // change the content attribute d
dt
elements followed by one or more dd
elements, optionally intermixed with script-supporting elements.dt
elements followed by one or more dd
elements, optionally intermixed with script-supporting elements.div
elements, optionally intermixed with script-supporting elements.The dl
element represents an association list consisting of zero or
more name-value groups (a description list). A name-value group consists of one or more names
- (dt
elements) followed by one or more values (dd
elements), ignoring any
- nodes other than dt
and dd
elements. Within a single dl
- element, there should not be more than one dt
element for each name.
dt
elements, possibly as children of a div
element child) followed by
+ one or more values (dd
elements, possibly as children of a div
element
+ child), ignoring any nodes other than dt
and dd
element children, and
+ dt
and dd
elements that are children of div
element
+ children. Within a single dl
element, there should not be more than one
+ dt
element for each name.
Name-value groups may be terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data.
@@ -17837,30 +17842,88 @@ interface HTMLDListElement : HTMLElement {};The order of the list of groups, and of the names and values within each group, may be significant.
+In order to annotate groups with microdata attributes, or other global
+ attributes that apply to whole groups, or just for styling purposes, each group in a
+ dl
element can be wrapped in a div
element. This does not change the
+ semantics of the dl
element.
If a dl
element has no dt
or dd
element children, it
- contains no groups.
The name-value groups of a dl
element dl are determined using the
+ following algorithm. A name-value group has a name (a list of dt
elements, initially
+ empty) and a value (a list of dd
elements, initially empty).
Let groups be an empty list of name-value groups.
Let current be a new name-value group.
Let seenDd be false.
Let child be dl's first child.
Let grandchild be null.
While child is not null, follow these substeps:
+ +If child is a div
element, then follow these subsubsteps:
Let grandchild be child's first child.
While grandchild is not null, follow these subsubsubsteps:
-If a dl
element has one or more non-whitespace Text
node children, or has child elements that are
- neither dt
nor dd
elements, all such Text
nodes and
- elements, as well as their descendants (including any dt
or dd
- elements), do not form part of any groups in that dl
.
Process dt
or dd
for
+ grandchild.
If a dl
element has one or more dt
element children but no
- dd
element children, then it consists of one group with names but no values.
Set grandchild to grandchild's next + sibling.
If a dl
element has one or more dd
element children but no
- dt
element children, then it consists of one group with values but no names.
Otherwise, process dt
or dd
for
+ child.
If a dl
element's first dt
or dd
element child is a
- dd
element, then the first group has no associated name.
Set child to child's next sibling.
If a dl
element's last dt
or dd
element child is a
- dt
element, then the last group has no associated value.
If current is not empty, then append current to + groups.
When a dl
element doesn't match its content model, it is often due to
+
Return groups.
To process dt
or dd
for a node node means to
+ follow these steps:
Let groups, current, and seenDd be the same variables as + those of the same name in the algorithm that invoked these steps.
If node is a dt
element, then follow these substeps:
If seenDd is true, then append current to groups, set + current to a new name-value group, and set seenDd to false.
Append node to current's name.
Otherwise, if node is a dd
element, then append node to
+ current's value and set seenDd to true.
When a name-value group has an empty list as name or value, it is often due to
accidentally using dd
elements in the place of dt
elements and vice
versa. Conformance checkers can spot such mistakes and might be able to advise authors how to
correctly use the markup.
The following example illustrates the use of the dl
element to mark up metadata
of sorts. At the end of the example, one group has two metadata labels ("Authors" and "Editors")
- and two values ("Robert Rothman" and "Daniel Jackson").
div
element around the groups of dt
and dd
element, to aid
+ with styling.
- <dl> - <dt> Last modified time </dt> - <dd> 2004-12-23T23:33Z </dd> - <dt> Recommended update interval </dt> - <dd> 60s </dd> - <dt> Authors </dt> - <dt> Editors </dt> - <dd> Robert Rothman </dd> - <dd> Daniel Jackson </dd> -</dl>+
<dl> + <div> + <dt> Last modified time </dt> + <dd> 2004-12-23T23:33Z </dd> + </div> + <div> + <dt> Recommended update interval </dt> + <dd> 60s </dd> + </div> + <div> + <dt> Authors </dt> + <dt> Editors </dt> + <dd> Robert Rothman </dd> + <dd> Daniel Jackson </dd> + </div> +</dl>
This example uses microdata attributes in a dl
element, together
+ with the div
element, to annotate the ice cream desserts at a French restaurant.
<dl>
+ <div itemscope itemtype="http://schema.org/Product">
+ <dt itemprop="name">Café ou Chocolat Liégeois
+ <dd itemprop="offers" itemscope itemtype="http://schema.org/Offer">
+ <span itemprop="price">3.50</span>
+ <data itemprop="priceCurrency" value="EUR">€</data>
+ <dd itemprop="description">
+ 2 boules Café ou Chocolat, 1 boule Vanille, sause café ou chocolat, chantilly
+ </div>
+
+ <div itemscope itemtype="http://schema.org/Product">
+ <dt itemprop="name">Américaine
+ <dd itemprop="offers" itemscope itemtype="http://schema.org/Offer">
+ <span itemprop="price">3.50</span>
+ <data itemprop="priceCurrency" value="EUR">€</data>
+ <dd itemprop="description">
+ 1 boule Crème brûlée, 1 boule Vanille, 1 boule Caramel, chantilly
+ </div>
+</dl>
+
+ Without the div
element the markup would need to use the itemref
attribute to link the data in the dd
elements
+ with the item, as follows.
<dl>
+ <dt itemscope itemtype="http://schema.org/Product" itemref="1-offer 1-description">
+ <span itemprop="name">Café ou Chocolat Liégeois</span>
+ <dd id="1-offer" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
+ <span itemprop="price">3.50</span>
+ <data itemprop="priceCurrency" value="EUR">€</data>
+ <dd id="1-description" itemprop="description">
+ 2 boules Café ou Chocolat, 1 boule Vanille, sause café ou chocolat, chantilly
+
+ <dt itemscope itemtype="http://schema.org/Product" itemref="2-offer 2-description">
+ <span itemprop="name">Américaine</span>
+ <dd id="2-offer" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
+ <span itemprop="price">3.50</span>
+ <data itemprop="priceCurrency" value="EUR">€</data>
+ <dd id="2-description" itemprop="description">
+ 1 boule Crème brûlée, 1 boule Vanille, 1 boule Caramel, chantilly
+</dl>
+
+ The dl
element is inappropriate for marking up dialogue. Examples of how to mark up dialogue are shown below.
dd
or dt
elements inside dl
elements.dd
or dt
elements inside div
elements that are children of a dl
element.header
, footer
, sectioning content, or heading content descendants.dt
or dd
elements inside dl
elements.dt
or dd
elements inside div
elements that are children of a dl
element.dl
element.dl
element: one or more dt
elements followed by one or more dd
elements, optionally intermixed with script-supporting elements.dl
element: Flow content.The div
element has no special meaning at all. It represents its
children. It can be used with the class
, lang
, and title
attributes to mark up
- semantics common to a group of consecutive elements.
dl
+ element, wrapping groups of dt
and dd
elements.
Authors are strongly encouraged to view the div
element as an element
of last resort, for when no other element is suitable. Use of more appropriate elements instead of
@@ -114116,7 +114242,8 @@ interface External {
dd
dt
element(s)dl
dl
;
+ div
*HTMLElement
div
dl
elementsdl
HTMLDivElement
dt
*;
dd
*;
+ div
*;
script-supporting elementsHTMLDListElement
dt
dd
element(s)dl
dl
;
+ div
*HTMLElement