--- a/editcommands.html Wed Apr 06 14:26:08 2011 -0600
+++ b/editcommands.html Thu Apr 07 13:13:00 2011 -0600
@@ -27,7 +27,7 @@
<body class=draft>
<div class=head id=head>
<h1>HTML Editing Commands</h1>
-<h2 class="no-num no-toc" id=work-in-progress-—-last-update-6-april-2011>Work in Progress — Last Update 6 April 2011</h2>
+<h2 class="no-num no-toc" id=work-in-progress-—-last-update-7-april-2011>Work in Progress — Last Update 7 April 2011</h2>
<dl>
<dt>Editor
<dd>Aryeh Gregor <ayg+spec@aryeh.name>
@@ -59,10 +59,10 @@
<li><a href=#issues><span class=secno>2 </span>Issues</a></li>
<li><a href=#definitions><span class=secno>3 </span>Definitions</a></li>
<li><a href=#decomposing-a-range-into-nodes><span class=secno>4 </span>Decomposing a range into nodes</a></li>
- <li><a href="#clearing-an-element's-styles"><span class=secno>5 </span>Clearing an element's styles</a></li>
- <li><a href=#pushing-down-styles><span class=secno>6 </span>Pushing down styles</a></li>
- <li><a href=#forcing-the-style-of-a-node><span class=secno>7 </span>Forcing the style of a node</a></li>
- <li><a href=#styling-a-node><span class=secno>8 </span>Styling a node</a></li>
+ <li><a href="#clearing-an-element's-value"><span class=secno>5 </span>Clearing an element's value</a></li>
+ <li><a href=#pushing-down-values><span class=secno>6 </span>Pushing down values</a></li>
+ <li><a href=#forcing-the-value-of-a-node><span class=secno>7 </span>Forcing the value of a node</a></li>
+ <li><a href=#setting-the-value-of-a-node><span class=secno>8 </span>Setting the value of a node</a></li>
<li><a href=#commands><span class=secno>9 </span>Commands</a></li>
<li><a class=no-num href=#references>References</a></li>
<li><a class=no-num href=#acknowledgements>Acknowledgements</a></ol>
@@ -210,14 +210,14 @@
"inline-table".
<p class=XXX>Currently when we hit an unwrappable element, we ignore it and
-style its children. Alternatively, if we would otherwise create a span with a
+alter its children. Alternatively, if we would otherwise create a span with a
style element on it, maybe we could put the style element directly on the
unwrappable element. This would produce shorter markup in many cases, but
would also cause problems for things like background-color that do something
different on block elements.
-<p>The <dfn id=effective-style>effective style</dfn> of a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> <var title="">node</var> for a given
-<var title="">property</var> is returned by the following algorithm, which will return
+<p>The <dfn id=effective-value>effective value</dfn> of a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> <var title="">node</var> for a given
+<var title="">command</var> is returned by the following algorithm, which will return
either a string or null:
<ol>
@@ -227,10 +227,10 @@
<li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node and its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> is null, return
null.
- <li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node, return the <a href=#effective-style>effective
- style</a> of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> for <var title="">property</var>.
+ <li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node, return the <a href=#effective-value>effective
+ value</a> of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> for <var title="">command</var>.
- <li>If <var title="">property</var> is "background-color":
+ <li>If <var title="">command</var> is "hiliteColor":
<ol>
<li>While the computed style of "background-color" on <var title="">node</var> is
@@ -244,18 +244,12 @@
<var title="">node</var>.
</ol>
- <li>If <var title="">property</var> is "text-decoration", and the "text-decoration"
+ <li>If <var title="">command</var> is "underline", and the "text-decoration"
property of <var title="">node</var> or any of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-ancestor title=concept-tree-ancestor>ancestors</a> computes to
- "underline", return "underline". Otherwise, return "none".
+ a value containing "underline", return "underline". Otherwise, return
+ "none".
- <p class=XXX>We ignore the possibility of text-decorations other than
- underline for now, so we pretend that there are only two possible values:
- "underline" and "none".
-
- <li>If <var title="">property</var> is "vertical-align":
-
- <p class=XXX>We massively abuse this property. Maybe we shouldn't be using
- the CSS names here.
+ <li>If <var title="">command</var> is "subscript" or "superscript":
<ol>
<li>Let <var title="">affected by subscript</var> and <var title="">affected by
@@ -287,24 +281,19 @@
<li>Return "baseline".
</ol>
- <li>Return the computed style of <var title="">property</var> for <var title="">node</var>.
+ <li>Return the computed style for <var title="">node</var> of the <a href=#relevant-css-property>relevant CSS
+ property</a> for <var title="">command</var>.
</ol>
-<p>The <dfn id=specified-style>specified style</dfn> of an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> for a given
-<var title="">property</var> is returned by the following algorithm, which will return
-either a CSS value or null:
+<p>The <dfn id=specified-value>specified value</dfn> of an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> for a given
+<var title="">command</var> is returned by the following algorithm, which will return
+either a string or null:
<ol>
- <li>If <var title="">property</var> is "background-color" and the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>'s
- display property does not compute to "inline", return null. <!-- This is
- because we currently only use background-color for hiliteColor, which we only
- want to work as a highlight. In CSS terms, this means that we only want to
- consider backgrounds that are applied to inline boxes. Roughly speaking,
- "specified style" means "style we're able to change", and we don't change
- non-inline background-colors. Maybe the name "specified style" is
- misleading, though. -->
+ <li>If <var title="">command</var> is "hiliteColor" and the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>'s
+ display property does not compute to "inline", return null.
- <li>If <var title="">property</var> is "vertical-align":
+ <li>If <var title="">command</var> is "subscript" or "superscript":
<ol>
<li>If the computed value of the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>'s "display" property is
@@ -321,14 +310,18 @@
<li>Return null.
</ol>
+ <li>Let <var title="">property</var> be the <a href=#relevant-css-property>relevant CSS property</a> for
+ <var title="">command</var>.
+
+ <li>If <var title="">property</var> is null, return null.
+
<li>If the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> has a <code class=external data-anolis-spec=html title="the style attribute"><a href=http://www.whatwg.org/html/#the-style-attribute>style</a></code> attribute set, and that attribute has
the effect of setting <var title="">property</var>, return the value that it sets
<var title="">property</var> to.
- <li>If the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> is a <code class=external data-anolis-spec=html><a href=http://www.whatwg.org/html/#font>font</a></code> element
- that has an attribute whose effect is to create a <a class=external data-anolis-spec=html href=http://www.whatwg.org/html/#presentational-hints title="presentational hints">presentational hint</a> for
- <var title="">property</var>, return the value that the hint sets <var title="">property</var>
- to.
+ <li>If the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> is a <code class=external data-anolis-spec=html title=font><a href=http://www.whatwg.org/html/#font>font</a></code> element that has an attribute whose
+ effect is to create a <a class=external data-anolis-spec=html href=http://www.whatwg.org/html/#presentational-hints title="presentational hints">presentational hint</a> for <var title="">property</var>, return
+ the value that the hint sets <var title="">property</var> to.
<li>If the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> is in the following list, and <var title="">property</var> is
equal to the CSS property name listed for it, return the string listed for
@@ -350,20 +343,12 @@
<li>Return null.
</ol>
-<p>A <dfn id=styling-element>styling element</dfn> is a <code class=external data-anolis-spec=html title="the b element"><a href=http://www.whatwg.org/html/#the-b-element>b</a></code>, <code class=external data-anolis-spec=html title="the em element"><a href=http://www.whatwg.org/html/#the-em-element>em</a></code>, <code class=external data-anolis-spec=html title="the i element"><a href=http://www.whatwg.org/html/#the-i-element>i</a></code>, <code class=external data-anolis-spec=html title="the span element"><a href=http://www.whatwg.org/html/#the-span-element>span</a></code>,
+<p>A <dfn id=modifiable-element>modifiable element</dfn> is a <code class=external data-anolis-spec=html title="the b element"><a href=http://www.whatwg.org/html/#the-b-element>b</a></code>, <code class=external data-anolis-spec=html title="the em element"><a href=http://www.whatwg.org/html/#the-em-element>em</a></code>, <code class=external data-anolis-spec=html title="the i element"><a href=http://www.whatwg.org/html/#the-i-element>i</a></code>, <code class=external data-anolis-spec=html title="the span element"><a href=http://www.whatwg.org/html/#the-span-element>span</a></code>,
<code class=external data-anolis-spec=html title="the strong element"><a href=http://www.whatwg.org/html/#the-strong-element>strong</a></code>, <code class=external data-anolis-spec=html title="the sub and sup elements"><a href=http://www.whatwg.org/html/#the-sub-and-sup-elements>sub</a></code>, <code class=external data-anolis-spec=html title="the sub and sup elements"><a href=http://www.whatwg.org/html/#the-sub-and-sup-elements>sup</a></code>, or <code class=external data-anolis-spec=html title="the u element"><a href=http://www.whatwg.org/html/#the-u-element>u</a></code> element with no attributes except
possibly <code class=external data-anolis-spec=html title="the style attribute"><a href=http://www.whatwg.org/html/#the-style-attribute>style</a></code>, or a <code class=external data-anolis-spec=html title=font><a href=http://www.whatwg.org/html/#font>font</a></code> element with no attributes except possibly
<code class=external data-anolis-spec=html title="the style attribute"><a href=http://www.whatwg.org/html/#the-style-attribute>style</a></code>, <code class=external data-anolis-spec=html title=dom-font-color><a href=http://www.whatwg.org/html/#dom-font-color>color</a></code>, <code class=external data-anolis-spec=html title=dom-font-face><a href=http://www.whatwg.org/html/#dom-font-face>face</a></code>, and/or <code class=external data-anolis-spec=html title=dom-font-size><a href=http://www.whatwg.org/html/#dom-font-size>size</a></code>.
-<p class=note>Conceptually, a <a href=#styling-element>styling element</a> is a phrasing
-element whose only purpose is to style text. Thus changing around styling
-elements (such as moving them, breaking them up, deleting them, or switching
-them with other styling elements) is fine as long as the style is preserved.
-In fact, some styling elements are supposed to have semantics other than
-styling, but the algorithms here treat them as styling elements anyway, for
-compatibility with legacy user-agents that treat them that way.
-
-<p>A <dfn id=simple-styling-element>simple styling element</dfn> is an <a href=#html-element>HTML element</a> for
+<p>A <dfn id=simple-modifiable-element>simple modifiable element</dfn> is an <a href=#html-element>HTML element</a> for
which at least one of the following holds:
<ul>
@@ -399,9 +384,9 @@
(including invalid or unrecognized properties).
</ul>
-<p class=note>Conceptually, a <a href=#simple-styling-element>simple styling element</a> is a
-<a href=#styling-element>styling element</a> which <a href=#specified-style title="specified
-style">specifies</a> at most one CSS property.
+<p class=note>Conceptually, a simple modifiable element is a modifiable element
+which <a href=#specified-value title="specified value">specifies</a> a value for at most one
+command.
<p>When the user agent is to move a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> to a new location, <dfn id=preserving-ranges>preserving
ranges</dfn>, it must remove the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> from its original <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a>, then
@@ -493,31 +478,31 @@
</ol>
-<h2 id="clearing-an-element's-styles"><span class=secno>5 </span>Clearing an element's styles</h2>
-<p>When a user agent is to <dfn id=clear-styles>clear styles</dfn> on an element, it must run
+<h2 id="clearing-an-element's-value"><span class=secno>5 </span>Clearing an element's value</h2>
+<p>When a user agent is to <dfn id=clear-the-value>clear the value</dfn> of an element, it must run
the following steps:
-<p class=note>Clearing styles can remove it from its parent and put other nodes
-in its place. When implementations do something like clear style on all
-children of an element, they should take care not to assume that the set of
-children won't change as they're unstyled. If the element is removed, the
-algorithm will return the list of nodes inserted in its place.
+<p class=note>Clearing the value of an element can remove it from its parent
+and put other nodes in its place. When implementations do something like clear
+the value of all children of an element, they should take care not to assume
+that the set of children won't change as they're cleared. If the element is
+removed, the algorithm will return the list of nodes inserted in its place.
<!-- If we wanted to be extra-pedantic, we could convert, e.g., <font color=red
id=foo> into <span id=foo> instead of <font id=foo>, but probably not worth it.
-->
<ol>
- <li>Let <var title="">element</var> be the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> to be unstyled.
+ <li>Let <var title="">element</var> be the <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> to be cleared.
- <li>Let <var title="">property</var> be as in the invoking algorithm.
+ <li>Let <var title="">command</var> be as in the invoking algorithm.
- <li>If <var title="">element</var>'s <a href=#specified-style>specified style</a> for
- <var title="">property</var> is null, return the empty list. <!-- We want to abort
+ <li>If <var title="">element</var>'s <a href=#specified-value>specified value</a> for
+ <var title="">command</var> is null, return the empty list. <!-- We want to abort
early so that we don't try unsetting background-color on a non-inline
element. -->
- <li>If <var title="">element</var> is a <a href=#simple-styling-element>simple styling element</a>:
+ <li>If <var title="">element</var> is a <a href=#simple-modifiable-element>simple modifiable element</a>:
<ol>
<li>Let <var title="">children</var> be the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">element</var>.
@@ -535,26 +520,27 @@
<li>Return <var title="">children</var>.
</ol>
- <li>Unset the CSS property <var title="">property</var> of <var title="">element</var>.
+ <li>Let <var title="">property</var> be the <a href=#relevant-css-property>relevant CSS property</a> for
+ <var title="">command</var>.
- <li>If <var title="">element</var> is a <code class=external data-anolis-spec=html><a href=http://www.whatwg.org/html/#font>font</a></code>
- element:
+ <li>If <var title="">property</var> is not null, unset the CSS property
+ <var title="">property</var> of <var title="">element</var>.
+
+ <li>If <var title="">element</var> is a <code class=external data-anolis-spec=html title=font><a href=http://www.whatwg.org/html/#font>font</a></code> element:
<ol>
<li>If <var title="">property</var> is "color", unset <var title="">element</var>'s
- <code class=external data-anolis-spec=html title=dom-font-color><a href=http://www.whatwg.org/html/#dom-font-color>color</a></code> attribute, if
- set.
+ <code class=external data-anolis-spec=html title=dom-font-color><a href=http://www.whatwg.org/html/#dom-font-color>color</a></code> attribute, if set.
<li>If <var title="">property</var> is "font-family", unset
<var title="">element</var>'s <code class=external data-anolis-spec=html title=dom-font-face><a href=http://www.whatwg.org/html/#dom-font-face>face</a></code> attribute, if set.
<li>If <var title="">property</var> is "font-size", unset <var title="">element</var>'s
- <code class=external data-anolis-spec=html title=dom-font-size><a href=http://www.whatwg.org/html/#dom-font-size>size</a></code> attribute, if
- set.
+ <code class=external data-anolis-spec=html title=dom-font-size><a href=http://www.whatwg.org/html/#dom-font-size>size</a></code> attribute, if set.
</ol>
- <li>If <var title="">element</var>'s <a href=#specified-style>specified style</a> for
- <var title="">property</var> is null, return the empty list.
+ <li>If <var title="">element</var>'s <a href=#specified-value>specified value</a> for
+ <var title="">command</var> is null, return the empty list.
<!-- If we get past this step, we're something like <b class=foo> where we
want to keep the extra attributes, so we stick them on a span. -->
@@ -578,9 +564,9 @@
</ol>
-<h2 id=pushing-down-styles><span class=secno>6 </span>Pushing down styles</h2>
-<p>When a user agent is to <dfn id=push-down-styles>push down styles</dfn> to a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a>
-<var title="">node</var>, given a CSS property name <var title="">property</var> and a new value
+<h2 id=pushing-down-values><span class=secno>6 </span>Pushing down values</h2>
+<p>When a user agent is to <dfn id=push-down-values>push down values</dfn> to a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a>
+<var title="">node</var>, given a command <var title="">command</var> and a new value
<var title="">new value</var>, it must run the following steps:
<div class=XXX>
@@ -619,7 +605,7 @@
<li>If <var title="">node</var>'s <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> is not an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>, abort this
algorithm. <!-- E.g., a text node child of a document fragment. -->
- <li>If the <a href=#effective-style>effective style</a> of <var title="">property</var> is <var title="">new
+ <li>If the <a href=#effective-value>effective value</a> of <var title="">command</var> is <var title="">new
value</var> on <var title="">node</var>, abort this algorithm.
<li>Let <var title="">current ancestor</var> be <var title="">node</var>'s <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a>.
@@ -627,22 +613,24 @@
<li>Let <var title="">ancestor list</var> be a list of <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>nodes</a>, initially empty.
<li>While <var title="">current ancestor</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> and the
- <a href=#effective-style>effective style</a> of <var title="">property</var> is not <var title="">new
+ <a href=#effective-value>effective value</a> of <var title="">property</var> is not <var title="">new
value</var> on it, append <var title="">current ancestor</var> to <var title="">ancestor
list</var>, then set <var title="">current ancestor</var> to its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a>.
- <!-- We can only remove specified styles, so if the style isn't specified,
+ <li>If <var title="">ancestor list</var> is empty, abort this algorithm.
+
+ <li>Let <var title="">propagated value</var> be the <a href=#specified-value>specified value</a> of
+ <var title="">command</var> on the last member of <var title="">ancestor list</var>.
+
+ <!-- We can only remove specified values, so if the value isn't specified,
give up. -->
- <li>If <var title="">ancestor list</var> is not empty, and the <a href=#specified-style>specified
- style</a> of <var title="">property</var> on the last member of <var title="">ancestor
- list</var> is null, abort this algorithm.
+ <li>If <var title="">propagated value</var> is null, abort this algorithm.
<!-- If we go all the way up to the root and still don't have the desired
- style, pushing down styles is pointless. It will create extra markup for no
+ value, pushing down values is pointless. It will create extra markup for no
purpose. -->
- <li>If <var title="">ancestor list</var> is not empty, and the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> of the last
- member of <var title="">ancestor list</var> is not an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>, abort this
- algorithm.
+ <li>If the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> of the last member of <var title="">ancestor list</var> is not
+ an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>, abort this algorithm.
<li>While <var title="">ancestor list</var> is not empty:
@@ -652,16 +640,14 @@
<li>Remove the last member from <var title="">ancestor list</var>.
- <li>Let <var title="">propagated value</var> be the <a href=#specified-style>specified style</a> of
- <var title="">current ancestor</var> for <var title="">property</var>.
-
- <li>If <var title="">propagated value</var> is null, continue this loop from the
- beginning.
+ <li>If the <a href=#specified-value>specified value</a> of <var title="">current ancestor</var> for
+ <var title="">command</var> is not null, set <var title="">propagated value</var> to that
+ value.
<li>Let <var title="">children</var> be the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">current
ancestor</var>.
- <li><a href=#clear-styles>Clear styles</a> on <var title="">current ancestor</var>.
+ <li><a href=#clear-the-value>Clear the value</a> of <var title="">current ancestor</var>.
<li>For every <var title="">child</var> in <var title="">children</var>:
@@ -669,36 +655,32 @@
<li>If <var title="">child</var> is <var title="">node</var>, continue with the next
<var title="">child</var>.
- <li>If <var title="">child</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> whose <a href=#specified-style>specified
- style</a> for <var title="">property</var> is neither null nor equal to
+ <li>If <var title="">child</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> whose <a href=#specified-value>specified
+ value</a> for <var title="">command</var> is neither null nor equal to
<var title="">propagated value</var>, continue with the next <var title="">child</var>.
<li>If <var title="">child</var> is the last member of <var title="">ancestor list</var>,
- set <var title="">child</var>'s CSS property <var title="">property</var> to
- <var title="">propagated value</var> and continue with the next <var title="">child</var>.
+ continue with the next <var title="">child</var>.
- <p class=note>This style will be removed on the next loop iteration and
- distributed to its children.
-
- <li><a href=#force-the-style>Force the style</a> of <var title="">child</var>, with
- <var title="">property</var> as in this algorithm and <var title="">new value</var> equal
+ <li><a href=#force-the-value>Force the value</a> of <var title="">child</var>, with
+ <var title="">command</var> as in this algorithm and <var title="">new value</var> equal
to <var title="">propagated value</var>.
</ol>
</ol>
</ol>
-<h2 id=forcing-the-style-of-a-node><span class=secno>7 </span>Forcing the style of a node</h2>
-<p>When a user agent is to <dfn id=force-the-style>force the style</dfn> of a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a>
-<var title="">node</var>, given a CSS property name <var title="">property</var> and a new value
+<h2 id=forcing-the-value-of-a-node><span class=secno>7 </span>Forcing the value of a node</h2>
+<p>When a user agent is to <dfn id=force-the-value>force the value</dfn> of a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a>
+<var title="">node</var>, given a command <var title="">command</var> and a new value
<var title="">new value</var>, it must run the following steps.
-<p class=note>This algorithm checks if the node has the desired style, and if
+<p class=note>This algorithm checks if the node has the desired value, and if
not, it wraps the node (or, if that's not possible, its descendants) in a
-<a href=#simple-styling-element>simple styling element</a>. This is only used as a last resort after
-<a href=#clear-styles title="clear styles">clearing styles</a> and <a href=#push-down-styles title="push down
-styles">pushing down styles</a> don't work to achieve the desired style.
-After forcing the style, descendants might still have different style.
+<a href=#simple-modifiable-element>simple modifiable element</a>. This is only used as a last resort
+after <a href=#clear-the-value title="clear the value">clearing the value</a> and <a href=#push-down-values title="push down values">pushing down values</a> don't work to achieve the
+desired value. After forcing the value, descendants might still have a
+different value.
<ol>
<li>If <var title="">node</var>'s <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> is null, abort this algorithm.
@@ -708,7 +690,7 @@
element</a>:
<ol>
- <!-- Even if the style matches, we stick it in a preceding sibling if
+ <!-- Even if the value matches, we stick it in a preceding sibling if
possible. This ensures "a<cite>b</cite>c" -> "<i>a<cite>b</cite>c</i>"
instead of "<i>a</i><cite>b</cite><i>c</i>". While we're at it, we also
handle more elaborate cases like <b>foo</b>[bar]<b>baz</b> and even
@@ -720,16 +702,16 @@
care, since the resulting style will still be right. -->
<li>Let <var title="">candidate</var> be <var title="">node</var>'s <code class=external data-anolis-spec=domcore title=dom-Node-previousSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-previoussibling>previousSibling</a></code>.
- <li>While <var title="">candidate</var> is a <a href=#styling-element>styling element</a>, and
+ <li>While <var title="">candidate</var> is a <a href=#modifiable-element>modifiable element</a>, and
<var title="">candidate</var> has exactly one <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a>, and that <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> is also
- a <a href=#styling-element>styling element</a>, and <var title="">candidate</var> is not a
- <a href=#simple-styling-element>simple styling element</a> or <var title="">candidate</var>'s
- <a href=#specified-style>specified style</a> for <var title="">property</var> is not <var title="">new
+ a <a href=#modifiable-element>modifiable element</a>, and <var title="">candidate</var> is not a
+ <a href=#simple-modifiable-element>simple modifiable element</a> or <var title="">candidate</var>'s
+ <a href=#specified-value>specified value</a> for <var title="">command</var> is not <var title="">new
value</var>, set <var title="">candidate</var> to its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a>.
- <li>If <var title="">candidate</var> is a <a href=#simple-styling-element>simple styling element</a> whose
- <a href=#specified-style>specified style</a> and <a href=#effective-style>effective style</a> for
- <var title="">property</var> are both <var title="">new value</var>, and <var title="">candidate</var>
+ <li>If <var title="">candidate</var> is a <a href=#simple-modifiable-element>simple modifiable element</a>
+ whose <a href=#specified-value>specified value</a> and <a href=#effective-value>effective value</a> for
+ <var title="">command</var> are both <var title="">new value</var>, and <var title="">candidate</var>
is not the <code class=external data-anolis-spec=domcore title=dom-Node-previousSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-previoussibling>previousSibling</a></code> of <var title="">node</var>:
<ol>
@@ -752,16 +734,16 @@
<li>Let <var title="">candidate</var> be <var title="">node</var>'s <code class=external data-anolis-spec=domcore title=dom-Node-nextSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-nextsibling>nextSibling</a></code>.
- <li>While <var title="">candidate</var> is a <a href=#styling-element>styling element</a>, and
+ <li>While <var title="">candidate</var> is a <a href=#modifiable-element>modifiable element</a>, and
<var title="">candidate</var> has exactly one <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a>, and that <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> is also
- a <a href=#styling-element>styling element</a>, and <var title="">candidate</var> is not a
- <a href=#simple-styling-element>simple styling element</a> or <var title="">candidate</var>'s
- <a href=#specified-style>specified style</a> for <var title="">property</var> is not <var title="">new
+ a <a href=#modifiable-element>modifiable element</a>, and <var title="">candidate</var> is not a
+ <a href=#simple-modifiable-element>simple modifiable element</a> or <var title="">candidate</var>'s
+ <a href=#specified-value>specified value</a> for <var title="">command</var> is not <var title="">new
value</var>, set <var title="">candidate</var> to its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a>.
- <li>If <var title="">candidate</var> is a <a href=#simple-styling-element>simple styling element</a> whose
- <a href=#specified-style>specified style</a> and <a href=#effective-style>effective style</a> for
- <var title="">property</var> are both <var title="">new value</var>, and <var title="">candidate</var>
+ <li>If <var title="">candidate</var> is a <a href=#simple-modifiable-element>simple modifiable element</a>
+ whose <a href=#specified-value>specified value</a> and <a href=#effective-value>effective value</a> for
+ <var title="">command</var> are both <var title="">new value</var>, and <var title="">candidate</var>
is not the <code class=external data-anolis-spec=domcore title=dom-Node-nextSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-nextsibling>nextSibling</a></code> of <var title="">node</var>:
<ol>
@@ -783,20 +765,20 @@
<li>Let <var title="">previous sibling</var> and <var title="">next sibling</var> be
<var title="">node</var>'s <code class=external data-anolis-spec=domcore title=dom-Node-previousSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-previoussibling>previousSibling</a></code> and <code class=external data-anolis-spec=domcore title=dom-Node-nextSibling><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-nextsibling>nextSibling</a></code>.
- <li>If <var title="">previous sibling</var> is a <a href=#simple-styling-element>simple styling element</a>
- whose <a href=#specified-style>specified style</a> and <a href=#effective-style>effective style</a> for
- <var title="">property</var> are both <var title="">new value</var>, append <var title="">node</var>
- as the last <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">previous sibling</var>, <a href=#preserving-ranges>preserving
- ranges</a>.
+ <li>If <var title="">previous sibling</var> is a <a href=#simple-modifiable-element>simple modifiable
+ element</a> whose <a href=#specified-value>specified value</a> and <a href=#effective-value>effective
+ value</a> for <var title="">command</var> are both <var title="">new value</var>, append
+ <var title="">node</var> as the last <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">previous sibling</var>,
+ <a href=#preserving-ranges>preserving ranges</a>.
- <li>If <var title="">next sibling</var> is a <a href=#simple-styling-element>simple styling element</a>
- whose <a href=#specified-style>specified style</a> and <a href=#effective-style>effective style</a> for
- <var title="">property</var> are both <var title="">new value</var>:
+ <li>If <var title="">next sibling</var> is a <a href=#simple-modifiable-element>simple modifiable element</a>
+ whose <a href=#specified-value>specified value</a> and <a href=#effective-value>effective value</a> for
+ <var title="">command</var> are both <var title="">new value</var>:
<ol>
<li>If <var title="">node</var> is not a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">previous sibling</var>,
- insert <var title="">node</var> as the first <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">next
- sibling</var>, <a href=#preserving-ranges>preserving ranges</a>.
+ insert <var title="">node</var> as the first <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">next sibling</var>,
+ <a href=#preserving-ranges>preserving ranges</a>.
<li>Otherwise, while <var title="">next sibling</var> has <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a>, append the
first <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of <var title="">next sibling</var> as the last <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> of
@@ -805,18 +787,18 @@
</ol>
</ol>
- <li>If the <a href=#effective-style>effective style</a> of <var title="">property</var> is <var title="">new
+ <li>If the <a href=#effective-value>effective value</a> of <var title="">command</var> is <var title="">new
value</var> on <var title="">node</var>, abort this algorithm.
<li>If <var title="">node</var> is an <a href=#unwrappable-element>unwrappable element</a>:
<ol>
<li>Let <var title="">children</var> be all <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">node</var>,
- omitting any that are <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>s whose <a href=#specified-style>specified style</a> for
- <var title="">property</var> is neither null nor equal to <var title="">new value</var>.
+ omitting any that are <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>s whose <a href=#specified-value>specified value</a> for
+ <var title="">command</var> is neither null nor equal to <var title="">new value</var>.
- <li><a href=#force-the-style>Force the style</a> of each <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> in <var title="">children</var>,
- with <var title="">property</var> and <var title="">new value</var> as in this invocation of
+ <li><a href=#force-the-value>Force the value</a> of each <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> in <var title="">children</var>,
+ with <var title="">command</var> and <var title="">new value</var> as in this invocation of
the algorithm.
<!-- This means that if it has no children, we do nothing. IE9 inserts an
empty wrapper element in that case, but I'm not sure what the point is, and
@@ -832,7 +814,7 @@
<li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#comment>Comment</a></code> or <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#processinginstruction>ProcessingInstruction</a></code>, abort
this algorithm.
- <li>If the <a href=#effective-style>effective style</a> of <var title="">property</var> is <var title="">new
+ <li>If the <a href=#effective-value>effective value</a> of <var title="">command</var> is <var title="">new
value</var> on <var title="">node</var>, abort this algorithm.
<li>Let <var title="">new parent</var> be null.
@@ -840,19 +822,19 @@
<li>If the <a href=#css-styling-flag>CSS styling flag</a> is false:
<ol>
- <li>If <var title="">property</var> is "font-weight" and <var title="">new value</var> is
+ <li>If <var title="">command</var> is "bold" and <var title="">new value</var> is
"bold", let <var title="">new parent</var> be the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("b")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>.
- <li>If <var title="">property</var> is "font-style" and <var title="">new value</var> is
+ <li>If <var title="">command</var> is "italic" and <var title="">new value</var> is
"italic", let <var title="">new parent</var> be the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("i")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>.
- <li>If <var title="">property</var> is "text-decoration" and <var title="">new value</var> is
+ <li>If <var title="">command</var> is "underline" and <var title="">new value</var> is
"underline", let <var title="">new parent</var> be the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("u")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>.
- <li>If <var title="">property</var> is "color", let <var title="">new parent</var> be the
+ <li>If <var title="">command</var> is "foreColor", let <var title="">new parent</var> be the
result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("font")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>, then set the <code class=external data-anolis-spec=html title=dom-font-color><a href=http://www.whatwg.org/html/#dom-font-color>color</a></code> attribute
of <var title="">new parent</var> to <var title="">new value</var>.
@@ -861,26 +843,26 @@
We also need to specify exactly how it's serialized, since CSSOM doesn't
cover this. It might be best to always output simple colors.
- <li>If <var title="">property</var> is "font-family", let <var title="">new parent</var> be
+ <li>If <var title="">command</var> is "fontName", let <var title="">new parent</var> be
the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("font")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>, then set the <code class=external data-anolis-spec=html title=dom-font-face><a href=http://www.whatwg.org/html/#dom-font-face>face</a></code> attribute
of <var title="">new parent</var> to <var title="">new value</var>.
- <li>If <var title="">property</var> is "font-size", let <var title="">new parent</var> be the
+ <li>If <var title="">command</var> is "fontSize", let <var title="">new parent</var> be the
result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("font")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>, then set the <code class=external data-anolis-spec=html title=dom-font-size><a href=http://www.whatwg.org/html/#dom-font-size>size</a></code> attribute
of <var title="">new parent</var> to <var title="">new value</var>.
</ol>
<!-- We always use sup/sub elements, even in CSS mode, following Gecko and
- contradicting WebKit. This is because <span style="vertical-align:
+ contradicting WebKit. This is because <span value="vertical-align:
sub/super">, the obvious equivalent (and what WebKit uses), behaves quite
differently: it doesn't reduce font-size, which is ugly. -->
- <li>If <var title="">property</var> is "vertical-align" and <var title="">new value</var> is
+ <li>If <var title="">command</var> is "subscript" and <var title="">new value</var> is
"sub", let <var title="">new parent</var> be the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("sub")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>.
- <li>If <var title="">property</var> is "vertical-align" and <var title="">new value</var> is
+ <li>If <var title="">command</var> is "superscript" and <var title="">new value</var> is
"super", let <var title="">new parent</var> be the result of calling <code class=external data-anolis-spec=domcore title=dom-Document-createElement><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-document-createelement>createElement("sup")</a></code> on the
<code class=external data-anolis-spec=domcore title=dom-Node-ownerDocument><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#dom-node-ownerdocument>ownerDocument</a></code> of <var title="">node</var>.
@@ -892,15 +874,16 @@
<var title="">node</var>. <!-- This preserves boundary points correctly, as usual.
-->
- <li>If the <a href=#effective-style>effective style</a> of <var title="">property</var> for <var title="">new
- parent</var> is not <var title="">new value</var>, set the CSS property
- <var title="">property</var> of <var title="">new parent</var> to <var title="">new value</var>.
+ <li>If the <a href=#effective-value>effective value</a> of <var title="">command</var> for <var title="">new
+ parent</var> is not <var title="">new value</var>, and the <a href=#relevant-css-property>relevant CSS
+ property</a> for <var title="">command</var> is not null, set that CSS property of
+ <var title="">new parent</var> to <var title="">new value</var>.
<li>Append <var title="">node</var> to <var title="">new parent</var> as its last <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a>,
<a href=#preserving-ranges>preserving ranges</a>.
- <li>If <var title="">node</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> and the <a href=#effective-style>effective style</a>
- of <var title="">property</var> for <var title="">node</var> is not <var title="">new value</var>:
+ <li>If <var title="">node</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> and the <a href=#effective-value>effective value</a>
+ of <var title="">command</var> for <var title="">node</var> is not <var title="">new value</var>:
<ol>
<li>Insert <var title="">node</var> into the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> of <var title="">new parent</var>
@@ -908,28 +891,29 @@
<li>Remove <var title="">new parent</var> from its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a>.
- <li>If <var title="">new parent</var> is a <code class=external data-anolis-spec=html title="the span element"><a href=http://www.whatwg.org/html/#the-span-element>span</a></code>, set the CSS property
- <var title="">property</var> of <var title="">node</var> to <var title="">new value</var>.
+ <li>If <var title="">new parent</var> is a <code class=external data-anolis-spec=html title="the span element"><a href=http://www.whatwg.org/html/#the-span-element>span</a></code>, and the <a href=#relevant-css-property>relevant CSS
+ property</a> for <var title="">command</var> is not null, set that CSS property
+ of <var title="">node</var> to <var title="">new value</var>.
<li>Otherwise:
<ol>
<li>Let <var title="">children</var> be all <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">node</var>,
- omitting any that are <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>s whose <a href=#specified-style>specified style</a> for
- <var title="">property</var> is neither null nor equal to <var title="">new value</var>.
+ omitting any that are <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>s whose <a href=#specified-value>specified value</a> for
+ <var title="">command</var> is neither null nor equal to <var title="">new value</var>.
- <li><a href=#force-the-style>Force the style</a> of each <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> in <var title="">children</var>,
- with <var title="">property</var> and <var title="">new value</var> as in this invocation
+ <li><a href=#force-the-value>Force the value</a> of each <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> in <var title="">children</var>,
+ with <var title="">command</var> and <var title="">new value</var> as in this invocation
of the algorithm.
</ol>
</ol>
</ol>
-<h2 id=styling-a-node><span class=secno>8 </span>Styling a node</h2>
-<p>When a user agent is to <dfn id=style>style</dfn> a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> <var title="">node</var>, it must
-run the following steps. There are two inputs: a CSS property name
-<var title="">property</var> and a new value <var title="">new value</var>.
+<h2 id=setting-the-value-of-a-node><span class=secno>8 </span>Setting the value of a node</h2>
+<p>When a user agent is to <dfn id=set-the-value>set the value</dfn> of a <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a>
+<var title="">node</var>, it must run the following steps. There are two inputs: a
+command <var title="">command</var> and a new value <var title="">new value</var>.
<div class=note>
<p>The effect of this algorithm is to ensure that the node and all its
@@ -942,7 +926,7 @@
from an ancestor we can't reach). Any other failures are bugs.
<p>First, if the node is an element with an inline style rule for this
-property, we unset it ("clearing styles"). This step also removes <a href=#simple-styling-element title="simple styling element">simple styling elements</a> entirely, and
+property, we unset it ("clearing styles"). This step also removes <a href=#simple-modifiable-element title="simple modifiable element">simple modifiable elements</a> entirely, and
replaces elements like <code class=external data-anolis-spec=html title="the b element"><a href=http://www.whatwg.org/html/#the-b-element>b</a></code> or <code class=external data-anolis-spec=html title=font><a href=http://www.whatwg.org/html/#font>font</a></code> with <code class=external data-anolis-spec=html title="the span element"><a href=http://www.whatwg.org/html/#the-span-element>span</a></code>s if they aren't simple
styling elements. This will be sufficient if the desired style is inherited
from an ancestor, or if it's the default (like font-style: normal) and no
@@ -973,7 +957,7 @@
<p>Finally, if neither of the above strategies worked, we have to add new
markup to get the desired style ("forcing styles"). First we try just sticking
-it into its previous or next sibling, if that's a <a href=#simple-styling-element>simple styling
+it into its previous or next sibling, if that's a <a href=#simple-modifiable-element>simple modifiable
element</a> (so it won't add any styles or semantics we don't want).
Otherwise, we create a new simple styling element and wrap it in that. It's
common that a previous sibling is the simple styling element we want, because
@@ -998,12 +982,12 @@
</div>
<ol>
- <li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#document>Document</a></code>, <a href=#style>style</a> its <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>
- <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> (if it has one) and abort this algorithm.
+ <li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#document>Document</a></code>, <a href=#set-the-value>set the value</a> of its
+ <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code> <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>child</a> (if it has one) and abort this algorithm.
<li>If <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#documentfragment>DocumentFragment</a></code>, let <var title="">children</var> be
- a list of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a>. <a href=#style>Style</a> each member of <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a>,
- then abort this algorithm.
+ a list of its <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a>. <a href=#set-the-value>Set the value</a> of each member of
+ <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a>, then abort this algorithm.
<li>If <var title="">node</var>'s <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> is null, or if <var title="">node</var> is a <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#documenttype>DocumentType</a></code>, abort this algorithm.
@@ -1014,23 +998,23 @@
<li>If <var title="">node</var> is an <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#element>Element</a></code>:
<ol>
- <li><a href=#clear-styles>Clear styles</a> on <var title="">node</var>, and let <var title="">new
+ <li><a href=#clear-the-value>Clear the value</a> of <var title="">node</var>, and let <var title="">new
nodes</var> be the result.
<li>For each <var title="">new node</var> in <var title="">new nodes</var>,
- <a href=#style>style</a> <var title="">new node</var>, with the same inputs as this
- invocation of the algorithm.
+ <a href=#set-the-value>set the value</a> of <var title="">new node</var>, with the same inputs as
+ this invocation of the algorithm.
<li>If <var title="">node</var>'s <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-parent title=concept-tree-parent>parent</a> is null, abort this algorithm.
</ol>
- <li><a href=#push-down-styles>Push down styles</a> on <var title="">node</var>.
+ <li><a href=#push-down-values>Push down values</a> on <var title="">node</var>.
- <li><a href=#force-the-style>Force the style</a> of <var title="">node</var>.
+ <li><a href=#force-the-value>Force the value</a> of <var title="">node</var>.
<li>Let <var title="">children</var> be the <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-tree-child title=concept-tree-child>children</a> of <var title="">node</var>.
- <li><a href=#style>Style</a> each member of <var title="">children</var>.
+ <li><a href=#set-the-value>Set the value</a> of each member of <var title="">children</var>.
<p class=note>Styling a node involves clearing its styles, which can remove
it from the tree. Implementers should be careful to compute the list of
@@ -1083,7 +1067,9 @@
<p>The possible values for <var title="">commandId</var>, and their corresponding
meanings, are as follows. These values must be compared to the argument in an
-<a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#ascii-case-insensitive>ASCII case-insensitive</a> manner.
+<a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#ascii-case-insensitive>ASCII case-insensitive</a> manner. The
+<dfn id=relevant-css-property>relevant CSS property</dfn> of a command is defined here, and is null if
+omitted for a particular command.
<!-- Notes on commands I've looked at but haven't bothered specifying yet:
@@ -1140,14 +1126,14 @@
<dt><code title=""><dfn id=command-bold title=command-bold>bold</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>. If the
-state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#style>style</a> each
-returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> "font-weight" and <var title="">new
-value</var> "normal". Otherwise, <a href=#style>style</a> them with <var title="">new
+state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "normal".
+Otherwise, <a href=#set-the-value title="set the value">set their value</a> with <var title="">new
value</var> "bold".
<dd><strong>State</strong>: True if every <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node that is
-<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-style>effective
-style</a> either null or at least 700 for font-weight. Otherwise false.
+<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-value>effective
+value</a> either null or at least 700. Otherwise false.
<!-- For bold and similar commands, IE 9 RC seems to consider the state true or
false depending on the first element. All other browsers follow the same
general idea as the spec, considering a range bold only if all text in it is
@@ -1162,6 +1148,8 @@
string, and three out of the four return something that evaluates to false as a
boolean, so I'll go with Firefox and Opera. -->
+<dd><strong>Relevant CSS Property</strong>: "font-weight"
+
<dt><code title=""><dfn id=command-createlink title=command-createlink>createLink</dfn></code>
@@ -1250,8 +1238,8 @@
<dt><code title=""><dfn id=command-fontname title=command-fontname>fontName</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>, then
-<a href=#style>style</a> each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> equal to
-"font-family" and <var title="">new value</var> equal to <var title="">value</var>.
+<a href=#set-the-value>set the value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var>
+equal to <var title="">value</var>.
<!-- UAs differ a bit in the details here:
IE 9 RC: Empty string sets <font face="">
@@ -1294,6 +1282,8 @@
font-family. I'll leave CSSOM to decide what that means if there are no
applicable style rules. -->
+<dd><strong>Relevant CSS Property</strong>: "font-family"
+
<dt><code title=""><dfn id=command-forecolor title=command-forecolor>foreColor</dfn></code>
@@ -1313,9 +1303,9 @@
except in Opera, which tries to parse it in some crazy way and winds up with
"#00b025". rgba() colors don't work as uniformly, but I don't see any reason
to prohibit them. Best to just match CSS. -->
-Otherwise, it must <a href=#decompose>decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>, then
-<a href=#style>style</a> each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> equal to
-"color" and <var title="">new value</var> equal to <var title="">value</var>.
+Otherwise, it must <a href=#decompose>decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>, then <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> equal to
+<var title="">value</var>.
<dd><strong>State</strong>: Always false.
<!-- This matches IE 9 RC and Chrome 10. Opera 11 seems to return true if
@@ -1324,10 +1314,10 @@
which is an interesting approach, but I'll go with IE/WebKit, which makes at
least as much sense. -->
-<dd><strong>Value</strong>: The computed value of the CSS property "color"
-for . . .
-<!-- IE 9 RC returns the number 0 always, which makes no sense at all. This
-matches the other browsers. -->
+<dd><strong>Value</strong>:
+<!-- IE 9 RC returns the number 0 always, which makes no sense at all. -->
+
+<dd><strong>Relevant CSS Property</strong>: "color"
<dt><code title=""><dfn id=command-hilitecolor title=command-hiliteColor>hiliteColor</dfn></code>
@@ -1348,14 +1338,14 @@
<dd><strong>Action</strong>: If <var title="">value</var> is not a valid CSS color,
do nothing and abort these steps. Otherwise, <a href=#decompose>decompose</a> the
-<a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>, then <a href=#style>style</a> each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with
-<var title="">property</var> equal to "background-color" and <var title="">new value</var> equal
-to <var title="">value</var>.
+<a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>, then <a href=#set-the-value>set the value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with
+<var title="">new value</var> equal to <var title="">value</var>.
<dd><strong>State</strong>: Always false.
-<dd><strong>Value</strong>: The <a href=#effective-style>effective style</a> for
-"background-color" on . . .
+<dd><strong>Value</strong>:
+
+<dd><strong>Relevant CSS Property</strong>: "background-color"
<dt><code title=""><dfn id=command-insertimage title=command-insertimage>insertImage</dfn></code>
@@ -1403,18 +1393,19 @@
<dt><code title=""><dfn id=command-italic title=command-italic>italic</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>. If the
-state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#style>style</a> each
-returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> "font-style" and <var title="">new
-value</var> "normal". Otherwise, <a href=#style>style</a> them with <var title="">new
+state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "normal".
+Otherwise, <a href=#set-the-value title="set the value">set their value</a> with <var title="">new
value</var> "italic".
<dd><strong>State</strong>: True if every <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node that is
-<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-style>effective
-style</a> either null, "italic", or "oblique" for font-style. Otherwise
-false.
+<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-value>effective
+value</a> either null, "italic", or "oblique". Otherwise false.
<dd><strong>Value</strong>: Always the empty string.
+<dd><strong>Relevant CSS Property</strong>: "font-style"
+
<dt><code title=""><dfn id=command-stylewithcss title=command-stylewithcss>styleWithCSS</dfn></code>
@@ -1433,41 +1424,47 @@
<dt><code title=""><dfn id=command-subscript title=command-subscript>subscript</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>. If the
-state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#style>style</a> each
-returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> "vertical-align" and <var title="">new
-value</var> "baseline". Otherwise, <a href=#style>style</a> them with <var title="">new
+state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "baseline".
+Otherwise, <a href=#set-the-value title="set the value">set their value</a> with <var title="">new
value</var> "baseline", then <a href=#decompose>decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> again and
-<a href=#style>style</a> each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "sub".
+<a href=#set-the-value>set the value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var>
+"sub".
<dd><strong>State</strong>: True if every <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node that is
-<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-style>effective
-style</a> either null or "sub" for "vertical-align". Otherwise false.
+<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-value>effective
+value</a> either null or "sub". Otherwise false.
<dd><strong>Value</strong>:
+<dd><strong>Relevant CSS Property</strong>: "vertical-align"
+
<dt><code title=""><dfn id=command-superscript title=command-superscript>superscript</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>. If the
-state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#style>style</a> each
-returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> "vertical-align" and <var title="">new
-value</var> "baseline". Otherwise, <a href=#style>style</a> them with <var title="">new
+state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "baseline".
+Otherwise, <a href=#set-the-value title="set the value">set their value</a> with <var title="">new
value</var> "baseline", then <a href=#decompose>decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> again and
-<a href=#style>style</a> each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "super".
+<a href=#set-the-value>set the value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var>
+"super".
<dd><strong>State</strong>: True if every <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node that is
-<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-style>effective
-style</a> either null or "super" for "vertical-align". Otherwise false.
+<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-value>effective
+value</a> either null or "super". Otherwise false.
<dd><strong>Value</strong>:
+<dd><strong>Relevant CSS Property</strong>: "vertical-align"
+
<dt><code title=""><dfn id=command-underline title=command-underline>underline</dfn></code>
<dd><strong>Action</strong>: <a href=#decompose>Decompose</a> the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a>. If the
-state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#style>style</a> each
-returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">property</var> "text-decoration" and <var title="">new
-value</var> "none". Otherwise, <a href=#style>style</a> them with <var title="">new
+state of the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> for this command is then true, <a href=#set-the-value>set the
+value</a> of each returned <a class=external data-anolis-spec=domcore href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#concept-node title=concept-node>node</a> with <var title="">new value</var> "none".
+Otherwise, <a href=#set-the-value title="set the value">set their value</a> with <var title="">new
value</var> "underline".
<div class=XXX>
@@ -1520,11 +1517,13 @@
</div>
<dd><strong>State</strong>: True if every <code class=external data-anolis-spec=domcore><a href=http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#text>Text</a></code> node that is
-<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-style>effective
-style</a> either null or "underline" for text-decoration. Otherwise false.
+<a href=#effectively-contained>effectively contained</a> in the <a class=external data-anolis-spec=domrange href=http://html5.org/specs/dom-range.html#concept-range title=concept-range>range</a> has <a href=#effective-value>effective
+value</a> either null or "underline". Otherwise false.
<dd><strong>Value</strong>: Always the empty string.
+<dd><strong>Relevant CSS Property</strong>: "text-decoration"
+
<dt><code title=""><dfn id=command-unlink title=command-unlink>unlink</dfn></code>
@@ -1586,7 +1585,7 @@
<dd><strong>State</strong>:
<dd><strong>Value</strong>:
-</dl>
+
<h2 class=no-num id=references>References</h2><!--REFS-->
@@ -1608,3 +1607,4 @@
<script src=http://www.whatwg.org/specs/web-apps/current-work/dfn.js></script>
<!-- vim: set expandtab shiftwidth=2 tabstop=2: -->
+</dl>
\ No newline at end of file
--- a/implementation.js Wed Apr 06 14:26:08 2011 -0600
+++ b/implementation.js Thu Apr 07 13:13:00 2011 -0600
@@ -71,27 +71,25 @@
return property;
}
-function cssValuesEqual(property, val1, val2) {
+function valuesEqual(command, val1, val2) {
// This is a bad hack to work around browser incompatibility. It wouldn't
// work in real life, but it's good enough for a test implementation.
if (val1 === null || val2 === null) {
return val1 === val2;
}
- if (property == "verticalAlign") {
- // Fake property values
- if (val1 == "mixed" || val2 == "mixed") {
- return val1 === val2;
- }
+ if (command == "subscript" || command == "superscript") {
+ return val1 === val2;
}
- if (property == "fontWeight") {
+ if (command == "bold") {
return val1 == val2
|| (val1.toLowerCase() == "bold" && val2 == "700")
|| (val2.toLowerCase() == "bold" && val1 == "700")
|| (val1.toLowerCase() == "normal" && val2 == "400")
|| (val2.toLowerCase() == "normal" && val1 == "400");
}
+ var property = getRelevantCssProperty(command);
var test1 = document.createElement("span");
test1.style[property] = val1;
var test2 = document.createElement("span");
@@ -249,46 +247,6 @@
return false;
}
-function getActiveRange(doc) {
- // "Let selection be the result of calling getSelection() on the Document."
- //
- // We call getSelection() on defaultView instead, because Firefox and Opera
- // don't follow the DOM Range spec here:
- // https://bugzilla.mozilla.org/show_bug.cgi?id=636512
- var selection = doc.defaultView.getSelection();
-
- // "If there are no Ranges associated with selection, return null."
- if (selection.rangeCount == 0) {
- return null;
- }
-
- // "Let start be the boundary point with the earliest position among all of
- // selection's Ranges' starts."
- var startNode = null;
- var startOffset = null;
- for (var i = 0; i < selection.rangeCount; i++) {
- if (startNode === null) {
- startNode = selection.getRangeAt(i).startContainer;
- startOffset = selection.getRangeAt(i).startOffset;
- continue;
- }
- var testRange = doc.createRange();
- testRange.setStart(startNode, startOffset);
- if (testRange.compareBoundaryPoints(Range.START_TO_START, selection.getRangeAt(i)) < 0) {
- startNode = selection.getRangeAt(i).startContainer;
- startOffset = selection.getRangeAt(i).startOffset;
- }
- }
-
- // "Return the last Range in selection whose start is start."
- for (var i = selection.rangeCount - 1; i >= 0; i--) {
- if (selection.getRangeAt(i).startContainer == startNode
- && selection.getRangeAt(i).startOffset == startOffset) {
- return selection.getRangeAt(i);
- }
- }
-}
-
// "An unwrappable element is an HTML element which may not be used where only
// phrasing content is expected (not counting unknown or obsolete elements,
// which cannot be used at all); or any Element whose display property computes
@@ -320,9 +278,9 @@
}
/**
- * "effective style" per edit command spec
+ * "effective value" per edit command spec
*/
-function getEffectiveStyle(node, property) {
+function getEffectiveValue(node, command) {
// "If node is neither an Element nor a Text node, return null."
if (node.nodeType != Node.ELEMENT_NODE
&& node.nodeType != Node.TEXT_NODE) {
@@ -335,14 +293,14 @@
return null;
}
- // "If node is a Text node, return the effective style of its parent for
- // property."
+ // "If node is a Text node, return the effective value of its parent for
+ // command."
if (node.nodeType == Node.TEXT_NODE) {
- return getEffectiveStyle(node.parentNode, property);
+ return getEffectiveValue(node.parentNode, command);
}
- // "If property is "background-color":"
- if (property == "backgroundColor") {
+ // "If command is "hiliteColor":"
+ if (command == "hilitecolor") {
// "While the computed style of "background-color" on node is any
// fully transparent value, and node's parent is an Element, set
// node to its parent."
@@ -369,12 +327,12 @@
return getComputedStyle(node).backgroundColor;
}
- // "If property is "text-decoration", and the "text-decoration" property of
- // node or any of its ancestors computes to "underline", return
- // "underline". Otherwise, return "none"."
- if (property == "textDecoration") {
+ // "If command is "underline", and the "text-decoration" property of node
+ // or any of its ancestors computes to a value containing "underline",
+ // return "underline". Otherwise, return "none"."
+ if (command == "underline") {
do {
- if (getComputedStyle(node).textDecoration == "underline") {
+ if ((" " + getComputedStyle(node).textDecoration + " ").indexOf(" underline ") != -1) {
return "underline";
}
node = node.parentNode;
@@ -382,8 +340,8 @@
return "none";
}
- // "If property is "vertical-align":"
- if (property == "verticalAlign") {
+ // "If command is "subscript" or "superscript":"
+ if (command == "subscript" || command == "superscript") {
// "Let affected by subscript and affected by superscript be two
// boolean variables, both initially false."
var affectedBySubscript = false;
@@ -434,24 +392,25 @@
return "baseline";
}
- // "Return the computed style of property for node."
- return getComputedStyle(node)[property];
+ // "Return the computed style for node of the relevant CSS property for
+ // command."
+ return getComputedStyle(node)[getRelevantCssProperty(command)];
}
/**
- * "specified style" per edit command spec
+ * "specified value" per edit command spec
*/
-function getSpecifiedStyle(element, property) {
- // "If property is "background-color" and the Element's display property
- // does not compute to "inline", return null."
- if (property == "backgroundColor"
+function getSpecifiedValue(element, command) {
+ // "If command is "hiliteColor" and the Element's display property does not
+ // compute to "inline", return null."
+ if (command == "hilitecolor"
&& getComputedStyle(element).display != "inline") {
return null;
}
- // "If property is "vertical-align":"
- if (property == "verticalAlign") {
- // "If the computed value of the Element's "display" property is
+ // "If command is "subscript" or "superscript":"
+ if (command == "subscript" || command == "superscript") {
+ // "If the computed style of the Element's "display" property is
// neither "inline" nor "inline-block" nor "inline-table", return
// null."
var style = getComputedStyle(element);
@@ -482,6 +441,14 @@
return null;
}
+ // "Let property be the relevant CSS property for command."
+ var property = getRelevantCssProperty(command);
+
+ // "If property is null, return null."
+ if (property === null) {
+ return null;
+ }
+
// "If the Element has a style attribute set, and that attribute has the
// effect of setting property, return the value that it sets property to."
if (element.style[property] != "") {
@@ -515,7 +482,7 @@
&& (element.tagName == "B" || element.tagName == "STRONG")) {
return "bold";
}
- if (property == "fontStyle"
+ if (property == "fontValue"
&& (element.tagName == "I" || element.tagName == "EM")) {
return "italic";
}
@@ -528,10 +495,10 @@
return null;
}
-// "A styling element is a b, em, i, span, strong, sub, sup, or u element with
+// "A modifiable element is a b, em, i, span, strong, sub, sup, or u element with
// no attributes except possibly style, or a font element with no attributes
// except possibly style, color, face, and/or size."
-function isStylingElement(node) {
+function isModifiableElement(node) {
if (!isHtmlElement(node)) {
return false;
}
@@ -574,14 +541,14 @@
return false;
}
-function isSimpleStylingElement(node) {
- // "A simple styling element is an HTML element for which at least one of
- // the following holds:"
+function isSimpleModifiableElement(node) {
+ // "A simple modifiable element is an HTML element for which at least one
+ // of the following holds:"
if (!isHtmlElement(node)) {
return false;
}
- // Only these elements can possibly be a simple styling element.
+ // Only these elements can possibly be a simple modifiable element.
if (["B", "EM", "FONT", "I", "SPAN", "STRONG", "SUB", "SUP", "U"].indexOf(node.tagName) == -1) {
return false;
}
@@ -807,15 +774,15 @@
return ret;
}
-function clearStyles(element, property) {
- // "If element's specified style for property is null, return the empty
+function clearValue(element, command) {
+ // "If element's specified value for command is null, return the empty
// list."
- if (getSpecifiedStyle(element, property) === null) {
+ if (getSpecifiedValue(element, command) === null) {
return [];
}
- // "If element is a simple styling element:"
- if (isSimpleStylingElement(element)) {
+ // "If element is a simple modifiable element:"
+ if (isSimpleModifiableElement(element)) {
// "Let children be the children of element."
var children = Array.prototype.slice.call(element.childNodes);
@@ -832,10 +799,15 @@
return children;
}
- // "Unset the CSS property property of element."
- element.style[property] = '';
- if (element.getAttribute("style") == "") {
- element.removeAttribute("style");
+ // "Let property be the relevant CSS property for command."
+ var property = getRelevantCssProperty(command);
+
+ // "If property is not null, unset the CSS property property of element."
+ if (property !== null) {
+ element.style[property] = '';
+ if (element.getAttribute("style") == "") {
+ element.removeAttribute("style");
+ }
}
// "If element is a font element:"
@@ -858,9 +830,9 @@
}
}
- // "If element's specified style for property is null, return the empty
+ // "If element's specified value for command is null, return the empty
// list."
- if (getSpecifiedStyle(element, property) === null) {
+ if (getSpecifiedValue(element, command) === null) {
return [];
}
@@ -888,16 +860,16 @@
return [newElement];
}
-function pushDownStyles(node, property, newValue) {
+function pushDownValues(node, command, newValue) {
// "If node's parent is not an Element, abort this algorithm."
if (!node.parentNode
|| node.parentNode.nodeType != Node.ELEMENT_NODE) {
return;
}
- // "If the effective style of property is new value on node, abort this
+ // "If the effective value of command is new value on node, abort this
// algorithm."
- if (cssValuesEqual(property, getEffectiveStyle(node, property), newValue)) {
+ if (valuesEqual(command, getEffectiveValue(node, command), newValue)) {
return;
}
@@ -907,28 +879,34 @@
// "Let ancestor list be a list of Nodes, initially empty."
var ancestorList = [];
- // "While current ancestor is an Element and the effective style of
- // property is not new value on it, append current ancestor to ancestor
+ // "While current ancestor is an Element and the effective value of
+ // command is not new value on it, append current ancestor to ancestor
// list, then set current ancestor to its parent."
while (currentAncestor
&& currentAncestor.nodeType == Node.ELEMENT_NODE
- && !cssValuesEqual(property, getEffectiveStyle(currentAncestor, property), newValue)) {
+ && !valuesEqual(command, getEffectiveValue(currentAncestor, command), newValue)) {
ancestorList.push(currentAncestor);
currentAncestor = currentAncestor.parentNode;
}
- // "If ancestor list is not empty, and the specified style of property on
- // the last member of ancestor list is null, abort this algorithm."
- if (ancestorList.length != 0
- && getSpecifiedStyle(ancestorList[ancestorList.length - 1], property) === null) {
+ // "If ancestor list is empty, abort this algorithm."
+ if (!ancestorList.length) {
return;
}
- // "If ancestor list is not empty, and the parent of the last member of
- // ancestor list is not an Element, abort this algorithm."
- if (ancestorList.length != 0
- && (!ancestorList.slice(-1)[0]
- || ancestorList.slice(-1)[0].nodeType != Node.ELEMENT_NODE)) {
+ // "Let propagated value be the specified value of command on the last
+ // member of ancestor list."
+ var propagatedValue = getSpecifiedValue(ancestorList[ancestorList.length - 1], command);
+
+ // "If propagated value is null, abort this algorithm."
+ if (propagatedValue === null) {
+ return;
+ }
+
+ // "If the parent of the last member of ancestor list is not an Element,
+ // abort this algorithm."
+ if (!ancestorList[ancestorList.length - 1]
+ || ancestorList[ancestorList.length - 1].nodeType != Node.ELEMENT_NODE) {
return;
}
@@ -938,21 +916,17 @@
// "Remove the last member from ancestor list."
var currentAncestor = ancestorList.pop();
- // "Let propagated value be the specified style of current ancestor for
- // property."
- var propagatedValue = getSpecifiedStyle(currentAncestor, property);
-
- // "If propagated value is null, continue this loop from the
- // beginning."
- if (propagatedValue === null) {
- continue;
+ // "If the specified value of current ancestor for command is not null,
+ // set propagated value to that value."
+ if (getSpecifiedValue(currentAncestor, command) !== null) {
+ propagatedValue = getSpecifiedValue(currentAncestor, command);
}
// "Let children be the children of current ancestor."
var children = Array.prototype.slice.call(currentAncestor.childNodes);
- // "Clear styles on current ancestor."
- clearStyles(currentAncestor, property);
+ // "Clear the value of current ancestor."
+ clearValue(currentAncestor, command);
// "For every child in children:"
for (var i = 0; i < children.length; i++) {
@@ -963,31 +937,29 @@
continue;
}
- // "If child is an Element whose specified style for property name
+ // "If child is an Element whose specified value for command
// is neither null nor equal to propagated value, continue with the
// next child."
if (child.nodeType == Node.ELEMENT_NODE
- && getSpecifiedStyle(child, property) !== null
- && !cssValuesEqual(property, propagatedValue, getSpecifiedStyle(child, property))) {
+ && getSpecifiedValue(child, command) !== null
+ && !valuesEqual(command, propagatedValue, getSpecifiedValue(child, command))) {
continue;
}
- // "If child is the last member of ancestor list, set child's CSS
- // property property to propagated value and continue with the next
- // child."
+ // "If child is the last member of ancestor list, continue with the
+ // next child."
if (child == ancestorList[ancestorList.length - 1]) {
- child.style[property] = propagatedValue;
continue;
}
- // "Force the style of child, with property as in this algorithm
+ // "Force the value of child, with command as in this algorithm
// and new value equal to propagated value."
- forceStyle(child, property, propagatedValue);
+ forceValue(child, command, propagatedValue);
}
}
}
-function forceStyle(node, property, newValue) {
+function forceValue(node, command, newValue) {
// "If node's parent is null, abort this algorithm."
if (!node.parentNode) {
return;
@@ -1003,24 +975,24 @@
// "Let candidate be node's previousSibling."
var candidate = node.previousSibling;
- // "While candidate is a styling element, and candidate has exactly one
- // child, and that child is also a styling element, and candidate is
- // not a simple styling element or candidate's specified style for
- // property is not new value, set candidate to its child."
- while (isStylingElement(candidate)
+ // "While candidate is a modifiable element, and candidate has exactly one
+ // child, and that child is also a modifiable element, and candidate is
+ // not a simple modifiable element or candidate's specified value for
+ // command is not new value, set candidate to its child."
+ while (isModifiableElement(candidate)
&& candidate.childNodes.length == 1
- && isStylingElement(candidate.firstChild)
- && (!isSimpleStylingElement(candidate)
- || !cssValuesEqual(property, getSpecifiedStyle(candidate, property), newValue))) {
+ && isModifiableElement(candidate.firstChild)
+ && (!isSimpleModifiableElement(candidate)
+ || !valuesEqual(command, getSpecifiedValue(candidate, command), newValue))) {
candidate = candidate.firstChild;
}
- // "If candidate is a simple styling element whose specified style and
- // effective style for property are both new value, and candidate is
+ // "If candidate is a simple modifiable element whose specified value and
+ // effective value for command are both new value, and candidate is
// not the previousSibling of node:"
- if (isSimpleStylingElement(candidate)
- && cssValuesEqual(property, getSpecifiedStyle(candidate, property), newValue)
- && cssValuesEqual(property, getEffectiveStyle(candidate, property), newValue)
+ if (isSimpleModifiableElement(candidate)
+ && valuesEqual(command, getSpecifiedValue(candidate, command), newValue)
+ && valuesEqual(command, getEffectiveValue(candidate, command), newValue)
&& candidate != node.previousSibling) {
// "While candidate has children, insert the first child of
// candidate into candidate's parent immediately before candidate,
@@ -1041,24 +1013,24 @@
// "Let candidate be node's nextSibling."
var candidate = node.nextSibling;
- // "While candidate is a styling element, and candidate has exactly one
- // child, and that child is also a styling element, and candidate is
- // not a simple styling element or candidate's specified style for
- // property is not new value, set candidate to its child."
- while (isStylingElement(candidate)
+ // "While candidate is a modifiable element, and candidate has exactly one
+ // child, and that child is also a modifiable element, and candidate is
+ // not a simple modifiable element or candidate's specified value for
+ // command is not new value, set candidate to its child."
+ while (isModifiableElement(candidate)
&& candidate.childNodes.length == 1
- && isStylingElement(candidate.firstChild)
- && (!isSimpleStylingElement(candidate)
- || !cssValuesEqual(property, getSpecifiedStyle(candidate, property), newValue))) {
+ && isModifiableElement(candidate.firstChild)
+ && (!isSimpleModifiableElement(candidate)
+ || !valuesEqual(command, getSpecifiedValue(candidate, command), newValue))) {
candidate = candidate.firstChild;
}
- // "If candidate is a simple styling element whose specified style and
- // effective style for property are both new value, and candidate is
+ // "If candidate is a simple modifiable element whose specified value and
+ // effective value for command are both new value, and candidate is
// not the nextSibling of node:"
- if (isSimpleStylingElement(candidate)
- && cssValuesEqual(property, getSpecifiedStyle(candidate, property), newValue)
- && cssValuesEqual(property, getEffectiveStyle(candidate, property), newValue)
+ if (isSimpleModifiableElement(candidate)
+ && valuesEqual(command, getSpecifiedValue(candidate, command), newValue)
+ && valuesEqual(command, getEffectiveValue(candidate, command), newValue)
&& candidate != node.nextSibling) {
// "While candidate has children, insert the first child of
// candidate into candidate's parent immediately before candidate,
@@ -1080,20 +1052,20 @@
var previousSibling = node.previousSibling;
var nextSibling = node.nextSibling;
- // "If previous sibling is a simple styling element whose specified
- // style and effective style for property are both new value, append
+ // "If previous sibling is a simple modifiable element whose specified
+ // value and effective value for command are both new value, append
// node as the last child of previous sibling, preserving ranges."
- if (isSimpleStylingElement(previousSibling)
- && cssValuesEqual(property, getSpecifiedStyle(previousSibling, property), newValue)
- && cssValuesEqual(property, getEffectiveStyle(previousSibling, property), newValue)) {
+ if (isSimpleModifiableElement(previousSibling)
+ && valuesEqual(command, getSpecifiedValue(previousSibling, command), newValue)
+ && valuesEqual(command, getEffectiveValue(previousSibling, command), newValue)) {
movePreservingRanges(node, previousSibling, previousSibling.childNodes.length);
}
- // "If next sibling is a simple styling element whose specified style
- // and effective style for property are both new value:"
- if (isSimpleStylingElement(nextSibling)
- && cssValuesEqual(property, getSpecifiedStyle(nextSibling, property), newValue)
- && cssValuesEqual(property, getEffectiveStyle(nextSibling, property), newValue)) {
+ // "If next sibling is a simple modifiable element whose specified value
+ // and effective value for command are both new value:"
+ if (isSimpleModifiableElement(nextSibling)
+ && valuesEqual(command, getSpecifiedValue(nextSibling, command), newValue)
+ && valuesEqual(command, getEffectiveValue(nextSibling, command), newValue)) {
// "If node is not a child of previous sibling, insert node as the
// first child of next sibling, preserving ranges."
if (node.parentNode != previousSibling) {
@@ -1110,34 +1082,34 @@
}
}
- // "If the effective style of property is new value on node, abort this
+ // "If the effective value of command is new value on node, abort this
// algorithm."
- if (cssValuesEqual(property, getEffectiveStyle(node, property), newValue)) {
+ if (valuesEqual(command, getEffectiveValue(node, command), newValue)) {
return;
}
// "If node is an unwrappable element:"
if (isUnwrappableElement(node)) {
// "Let children be all children of node, omitting any that are
- // Elements whose specified style for property is neither null nor
+ // Elements whose specified value for command is neither null nor
// equal to new value."
var children = [];
for (var i = 0; i < node.childNodes.length; i++) {
if (node.childNodes[i].nodeType == Node.ELEMENT_NODE) {
- var specifiedStyle = getSpecifiedStyle(node.childNodes[i], property);
+ var specifiedValue = getSpecifiedValue(node.childNodes[i], command);
- if (specifiedStyle !== null
- && !cssValuesEqual(property, newValue, specifiedStyle)) {
+ if (specifiedValue !== null
+ && !valuesEqual(command, newValue, specifiedValue)) {
continue;
}
}
children.push(node.childNodes[i]);
}
- // "Force the style of each Node in children, with property and new
+ // "Force the value of each Node in children, with command and new
// value as in this invocation of the algorithm."
for (var i = 0; i < children.length; i++) {
- forceStyle(children[i], property, newValue);
+ forceValue(children[i], command, newValue);
}
// "Abort this algorithm."
@@ -1150,9 +1122,9 @@
return;
}
- // "If the effective style of property is new value on node, abort this
+ // "If the effective value of command is new value on node, abort this
// algorithm."
- if (cssValuesEqual(property, getEffectiveStyle(node, property), newValue)) {
+ if (valuesEqual(command, getEffectiveValue(node, command), newValue)) {
return;
}
@@ -1161,63 +1133,61 @@
// "If the CSS styling flag is false:"
if (!cssStylingFlag) {
- // "If property is "font-weight" and new value is "bold", let new
- // parent be the result of calling createElement("b") on the
- // ownerDocument of node."
- if (property == "fontWeight" && (newValue == "bold" || newValue == "700")) {
+ // "If command is "bold" and new value is "bold", let new parent be the
+ // result of calling createElement("b") on the ownerDocument of node."
+ if (command == "bold" && (newValue == "bold" || newValue == "700")) {
newParent = node.ownerDocument.createElement("b");
}
- // "If property is "font-style" and new value is "italic", let new
- // parent be the result of calling createElement("i") on the
- // ownerDocument of node."
- if (property == "fontStyle" && newValue == "italic") {
+ // "If command is "italic" and new value is "italic", let new parent be
+ // the result of calling createElement("i") on the ownerDocument of
+ // node."
+ if (command == "italic" && newValue == "italic") {
newParent = node.ownerDocument.createElement("i");
}
- // "If property is "text-decoration" and new value is "underline", let
- // new parent be the result of calling createElement("u") on the
+ // "If command is "underline" and new value is "underline", let new
+ // parent be the result of calling createElement("u") on the
// ownerDocument of node."
- if (property == "textDecoration" && newValue == "underline") {
+ if (command == "underline" && newValue == "underline") {
newParent = node.ownerDocument.createElement("u");
}
- // "If property is "color", let new parent be the result of calling
+ // "If command is "foreColor", let new parent be the result of calling
// createElement("font") on the ownerDocument of node, then set the
// color attribute of new parent to new value."
- if (property == "color") {
+ if (command == "forecolor") {
newParent = node.ownerDocument.createElement("font");
newParent.color = newValue;
}
- // "If property is "font-family", let new parent be the result of
- // calling createElement("font") on the ownerDocument of node, then set
- // the face attribute of new parent to new value."
- if (property == "fontFamily") {
+ // "If command is "fontName", let new parent be the result of calling
+ // createElement("font") on the ownerDocument of node, then set the
+ // face attribute of new parent to new value."
+ if (command == "fontname") {
newParent = node.ownerDocument.createElement("font");
newParent.face = newValue;
}
- // "If property is "font-size", let new parent be the result of calling
+ // "If command is "fontSize", let new parent be the result of calling
// createElement("font") on the ownerDocument of node, then set the
// size attribute of new parent to new value."
- if (property == "fontSize") {
+ if (command == "fontsize") {
newParent = node.ownerDocument.createElement("font");
newParent.size = newValue;
}
}
- // "If property is "vertical-align" and new value is "sub", let new parent
- // be the result of calling createElement("sub") on the ownerDocument of
- // node."
- if (property == "verticalAlign" && newValue == "sub") {
+ // "If command is "subscript" and new value is "sub", let new parent be the
+ // result of calling createElement("sub") on the ownerDocument of node."
+ if (command == "subscript" && newValue == "sub") {
newParent = node.ownerDocument.createElement("sub");
}
- // "If property is "vertical-align" and new value is "super", let new
- // parent be the result of calling createElement("sup") on the
- // ownerDocument of node."
- if (property == "verticalAlign" && newValue == "super") {
+ // "If command is "superscript" and new value is "super", let new parent be
+ // the result of calling createElement("sup") on the ownerDocument of
+ // node."
+ if (command == "superscript" && newValue == "super") {
newParent = node.ownerDocument.createElement("sup");
}
@@ -1230,19 +1200,22 @@
// "Insert new parent in node's parent before node."
node.parentNode.insertBefore(newParent, node);
- // "If the effective style of property for new parent is not new value, set
- // the CSS property property of new parent to new value."
- if (!cssValuesEqual(property, getEffectiveStyle(newParent, property), newValue)) {
+ // "If the effective value of command for new parent is not new value, and
+ // the relevant CSS property for command is not null, set that CSS property
+ // of new parent to new value."
+ var property = getRelevantCssProperty(command);
+ if (property !== null
+ && !valuesEqual(command, getEffectiveValue(newParent, command), newValue)) {
newParent.style[property] = newValue;
}
// "Append node to new parent as its last child, preserving ranges."
movePreservingRanges(node, newParent, newParent.childNodes.length);
- // "If node is an Element and the effective style of property for node is
+ // "If node is an Element and the effective value of command for node is
// not new value:"
if (node.nodeType == Node.ELEMENT_NODE
- && !cssValuesEqual(property, getEffectiveStyle(node, property), newValue)) {
+ && !valuesEqual(command, getEffectiveValue(node, command), newValue)) {
// "Insert node into the parent of new parent before new parent,
// preserving ranges."
movePreservingRanges(node, newParent.parentNode, getNodeIndex(newParent));
@@ -1250,45 +1223,46 @@
// "Remove new parent from its parent."
newParent.parentNode.removeChild(newParent);
- // "If new parent is a span, set the CSS property property of node to
- // new value."
- if (newParent.tagName == "SPAN") {
+ // "If new parent is a span, and the relevant CSS property for command
+ // is not null, set that CSS property of node to new value."
+ if (newParent.tagName == "SPAN"
+ && property !== null) {
node.style[property] = newValue;
// "Otherwise:"
} else {
// "Let children be all children of node, omitting any that are
- // Elements whose specified style for property is neither null nor
+ // Elements whose specified value for command is neither null nor
// equal to new value."
var children = [];
for (var i = 0; i < node.childNodes.length; i++) {
if (node.childNodes[i].nodeType == Node.ELEMENT_NODE) {
- var specifiedStyle = getSpecifiedStyle(node.childNodes[i], property);
+ var specifiedValue = getSpecifiedValue(node.childNodes[i], command);
- if (specifiedStyle !== null
- && !cssValuesEqual(property, newValue, specifiedStyle)) {
+ if (specifiedValue !== null
+ && !valuesEqual(command, newValue, specifiedValue)) {
continue;
}
}
children.push(node.childNodes[i]);
}
- // "Force the style of each Node in children, with property and new
+ // "Force the value of each Node in children, with command and new
// value as in this invocation of the algorithm."
for (var i = 0; i < children.length; i++) {
- forceStyle(children[i], property, newValue);
+ forceValue(children[i], command, newValue);
}
}
}
}
-function styleNode(node, property, newValue) {
- // "If node is a Document, style its Element child (if it has one) and
- // abort this algorithm."
+function setNodeValue(node, command, newValue) {
+ // "If node is a Document, set the value of its Element child (if it has
+ // one) and abort this algorithm."
if (node.nodeType == Node.DOCUMENT_NODE) {
for (var i = 0; i < node.childNodes.length; i++) {
if (node.childNodes[i].nodeType == Node.ELEMENT_NODE) {
- styleNode(node.childNodes[i], property, newValue);
+ setNodeValue(node.childNodes[i], command, newValue);
break;
}
}
@@ -1296,14 +1270,14 @@
}
// "If node is a DocumentFragment, let children be a list of its children.
- // Style each member of children, then abort this algorithm."
+ // Set the value of each member of children, then abort this algorithm."
if (node.nodeType == Node.DOCUMENT_FRAGMENT_NODE) {
var children = [];
for (var i = 0; i < node.childNodes.length; i++) {
children.push(node.childNodes[i]);
}
for (var i = 0; i < children.length; i++) {
- styleNode(children[i], property, newValue);
+ setNodeValue(children[i], command, newValue);
}
return;
}
@@ -1316,13 +1290,13 @@
// "If node is an Element:"
if (node.nodeType == Node.ELEMENT_NODE) {
- // "Clear styles on node, and let new nodes be the result."
- var newNodes = clearStyles(node, property);
+ // "Clear the value of node, and let new nodes be the result."
+ var newNodes = clearValue(node, command);
- // "For each new node in new nodes, style new node, with the same
- // inputs as this invocation of the algorithm."
+ // "For each new node in new nodes, set the value of new node, with the
+ // same inputs as this invocation of the algorithm."
for (var i = 0; i < newNodes.length; i++) {
- styleNode(newNodes[i], property, newValue);
+ setNodeValue(newNodes[i], command, newValue);
}
// "If node's parent is null, abort this algorithm."
@@ -1331,30 +1305,48 @@
}
}
- // "Push down styles on node."
- pushDownStyles(node, property, newValue);
+ // "Push down values on node."
+ pushDownValues(node, command, newValue);
- // "Force the style of node."
- forceStyle(node, property, newValue);
+ // "Force the value of node."
+ forceValue(node, command, newValue);
// "Let children be the children of node."
var children = Array.prototype.slice.call(node.childNodes);
- // "Style each member of children."
+ // "Set the value of each member of children."
for (var i = 0; i < children.length; i++) {
- styleNode(children[i], property, newValue);
+ setNodeValue(children[i], command, newValue);
}
}
// This is bad :(
var globalRange = null;
-function myExecCommand(commandId, showUI, value, range) {
- commandId = commandId.toLowerCase();
+function getRelevantCssProperty(command) {
+ var prop = {
+ bold: "fontWeight",
+ fontname: "fontFamily",
+ forecolor: "color",
+ hilitecolor: "backgroundColor",
+ italic: "fontStyle",
+ subscript: "verticalAlign",
+ superscript: "verticalAlign",
+ underline: "textDecoration",
+ }[command];
- if (commandId != "stylewithcss" && commandId != "usecss") {
- if (typeof range == "undefined") {
- range = getActiveRange(document);
+ if (typeof prop == "undefined") {
+ return null;
+ }
+ return prop;
+}
+
+function myExecCommand(command, showUI, value, range) {
+ command = command.toLowerCase();
+
+ if (command != "stylewithcss" && command != "usecss") {
+ if (typeof range == "undefined" && getSelection().rangeCount) {
+ range = getSelection().getRangeAt(0);
}
if (!range) {
@@ -1364,15 +1356,15 @@
globalRange = range;
- switch (commandId) {
+ switch (command) {
case "bold":
- // "Decompose the Range. If the state of the Range for this command is
- // then true, style each returned Node with property "font-weight" and
- // new value "normal". Otherwise, style them with new value "bold"."
+ // "Decompose the range. If the state of the range for this command is
+ // then true, set the value of each returned node with new value
+ // "normal". Otherwise, set their value with new value "bold"."
var nodeList = decomposeRange(range);
var newValue = getState("bold", range) ? "normal" : "bold";
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "fontWeight", newValue);
+ setNodeValue(nodeList[i], command, newValue);
}
break;
@@ -1455,48 +1447,46 @@
break;
case "fontname":
- // "Decompose the Range, then style each returned Node with property
- // equal to "font-family" and new value equal to value."
+ // "Decompose the range, then set the value of each returned node with
+ // new value equal to value."
var nodeList = decomposeRange(range);
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "fontFamily", value);
+ setNodeValue(nodeList[i], command, value);
}
break;
case "forecolor":
// "If value is not a valid CSS color, the user agent must do nothing
- // and abort these steps. Otherwise, it must decompose the Range, then
- // style each returned Node with property equal to "color" and new
- // value equal to value."
+ // and abort these steps. Otherwise, it must decompose the range, then
+ // set the value of each returned node with new value equal to value."
//
// Ignore validation for now.
var nodeList = decomposeRange(range);
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "color", value);
+ setNodeValue(nodeList[i], command, value);
}
break;
case "hilitecolor":
// "If value is not a valid CSS color, do nothing and abort these
- // steps. Otherwise, decompose the Range, then style each returned Node
- // with property equal to "background-color" and new value equal to
- // value."
+ // steps. Otherwise, decompose the range, then set the value of each
+ // returned node with new value equal to value."
//
// Ignore validation for now.
var nodeList = decomposeRange(range);
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "backgroundColor", value);
+ setNodeValue(nodeList[i], command, value);
}
break;
case "italic":
- // "Decompose the Range. If the state of the Range for this command is
- // then true, style each returned Node with property "font-style" and
- // new value "normal". Otherwise, style them with new value "italic"."
+ // "Decompose the range. If the state of the range for this command is
+ // then true, set the value of each returned node with new value
+ // "normal". Otherwise, set their value with new value "italic"."
var nodeList = decomposeRange(range);
var newValue = getState("italic", range) ? "normal" : "italic";
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "fontStyle", newValue);
+ setNodeValue(nodeList[i], command, newValue);
}
break;
@@ -1507,58 +1497,57 @@
break;
case "subscript":
- // "Decompose the Range. If the state of the Range for this command is
- // then true, style each returned Node with property "vertical-align"
- // and new value "baseline". Otherwise, style them with new value
- // "baseline", then decompose the Range again and style each returned
- // Node with new value "sub"."
+ // "Decompose the range. If the state of the range for this command is
+ // then true, set the value of each returned node with new value
+ // "baseline". Otherwise, set their value with new value "baseline",
+ // then decompose the range again and set the value of each returned
+ // node with new value "sub"."
var nodeList = decomposeRange(range);
- if (getState(commandId, range)) {
+ if (getState(command, range)) {
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "baseline");
+ setNodeValue(nodeList[i], command, "baseline");
}
} else {
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "baseline");
+ setNodeValue(nodeList[i], command, "baseline");
}
var nodeList = decomposeRange(range);
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "sub");
+ setNodeValue(nodeList[i], command, "sub");
}
}
break;
case "superscript":
- // "Decompose the Range. If the state of the Range for this command is
- // then true, style each returned Node with property "vertical-align"
- // and new value "baseline". Otherwise, style them with new value
- // "baseline", then decompose the Range again and style each returned
- // Node with new value "super"."
+ // "Decompose the range. If the state of the range for this command is
+ // then true, set the value of each returned node with new value
+ // "baseline". Otherwise, set their value with new value "baseline",
+ // then decompose the range again and set the value of each returned
+ // node with new value "super"."
var nodeList = decomposeRange(range);
- if (getState(commandId, range)) {
+ if (getState(command, range)) {
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "baseline");
+ setNodeValue(nodeList[i], command, "baseline");
}
} else {
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "baseline");
+ setNodeValue(nodeList[i], command, "baseline");
}
var nodeList = decomposeRange(range);
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "verticalAlign", "super");
+ setNodeValue(nodeList[i], command, "super");
}
}
break;
case "underline":
- // "Decompose the Range. If the state of the Range for this command is
- // then true, style each returned Node with property "text-decoration"
- // and new value "none". Otherwise, style them with new value
- // "underline"."
+ // "Decompose the range. If the state of the range for this command is
+ // then true, set the value of each returned node with new value
+ // "none". Otherwise, set their value with new value "underline"."
var nodeList = decomposeRange(range);
var newValue = getState("underline", range) ? "none" : "underline";
for (var i = 0; i < nodeList.length; i++) {
- styleNode(nodeList[i], "textDecoration", newValue);
+ setNodeValue(nodeList[i], command, newValue);
}
break;
@@ -1573,27 +1562,28 @@
}
}
-function myQueryCommandState(commandId) {
- commandId = commandId.toLowerCase();
- var range = getActiveRange(document);
+function myQueryCommandState(command) {
+ command = command.toLowerCase();
- if (!range) {
+ if (!getSelection().rangeCount) {
return false;
}
- return getState(commandId, range);
+ var range = getSelection().getRangeAt(0);
+
+ return getState(command, range);
}
-function getState(commandId, range) {
- if (commandId == "stylewithcss") {
+function getState(command, range) {
+ if (command == "stylewithcss") {
return cssStylingFlag;
}
- if (commandId != "bold"
- && commandId != "italic"
- && commandId != "underline"
- && commandId != "subscript"
- && commandId != "superscript") {
+ if (command != "bold"
+ && command != "italic"
+ && command != "underline"
+ && command != "subscript"
+ && command != "superscript") {
return false;
}
@@ -1614,49 +1604,49 @@
continue;
}
- if (commandId == "bold") {
+ if (command == "bold") {
// "True if every Text node that is effectively contained in the
- // Range has effective style either null or at least 700 for
- // font-weight. Otherwise false."
- var weight = getEffectiveStyle(node, "fontWeight");
- if (weight !== null
- && weight !== "bold"
- && weight !== "700"
- && weight !== "800"
- && weight !== "900") {
+ // range has effective value either null or at least 700. Otherwise
+ // false."
+ var fontWeight = getEffectiveValue(node, command);
+ if (fontWeight !== null
+ && fontWeight !== "bold"
+ && fontWeight !== "700"
+ && fontWeight !== "800"
+ && fontWeight !== "900") {
return false;
}
- } else if (commandId == "italic") {
+ } else if (command == "italic") {
// "True if every Text node that is effectively contained in the
- // Range has effective style either null, "italic", or "oblique"
- // for font-style. Otherwise false."
- var style = getEffectiveStyle(node, "fontStyle");
- if (style !== null
- && style !== "italic"
- && style !== "oblique") {
+ // range has effective value either null, "italic", or "oblique".
+ // Otherwise false."
+ var fontStyle = getEffectiveValue(node, command);
+ if (fontStyle !== null
+ && fontStyle !== "italic"
+ && fontStyle !== "oblique") {
return false;
}
- } else if (commandId == "underline") {
+ } else if (command == "underline") {
// "True if every Text node that is effectively contained in the
- // Range has effective style either null or "underline" for
- // text-decoration. Otherwise false."
- var decoration = getEffectiveStyle(node, "textDecoration");
- if (decoration !== null && decoration !== "underline") {
+ // range has effective value either null or "underline". Otherwise
+ // false."
+ var textDecoration = getEffectiveValue(node, command);
+ if (textDecoration !== null && textDecoration !== "underline") {
return false;
}
- } else if (commandId == "subscript") {
+ } else if (command == "subscript") {
// "True if every Text node that is effectively contained in the
- // Range has effective style either null or "sub" for
- // "vertical-align". Otherwise false."
- var verticalAlign = getEffectiveStyle(node, "verticalAlign");
+ // range has effective value either null or "sub". Otherwise
+ // false."
+ var verticalAlign = getEffectiveValue(node, command);
if (verticalAlign !== null && verticalAlign !== "sub") {
return false;
}
- } else if (commandId == "superscript") {
+ } else if (command == "superscript") {
// "True if every Text node that is effectively contained in the
- // Range has effective style either null or "super" for
- // "vertical-align". Otherwise false."
- var verticalAlign = getEffectiveStyle(node, "verticalAlign");
+ // range has effective value either null or "super". Otherwise
+ // false."
+ var verticalAlign = getEffectiveValue(node, command);
if (verticalAlign !== null && verticalAlign !== "super") {
return false;
}
@@ -1666,43 +1656,14 @@
return true;
}
-function myQueryCommandValue(commandId) {
- commandId = commandId.toLowerCase();
- var range = getActiveRange(document);
+function myQueryCommandValue(command) {
+ command = command.toLowerCase();
- if (!range) {
+ if (!getSelection().rangeCount) {
return "";
}
- return "";
- /*
- var style = getComputedStyle(beginningElement(range));
+ var range = getSelection().getRangeAt(0);
- switch (commandId) {
- case "backcolor":
- // "Let element be the beginning element of the Range."
- var element = beginningElement(range);
- // "While the computed style of "background-color" on element is any
- // fully transparent value, set element to its parent."
- while (element.nodeType == Node.ELEMENT_NODE
- && (getComputedStyle(element).backgroundColor == "rgba(0, 0, 0, 0)"
- || getComputedStyle(element).backgroundColor === ""
- || getComputedStyle(element).backgroundColor == "transparent")) {
- element = element.parentNode;
- }
- // "Return the computed style of "background-color" for element."
- if (element.nodeType != Node.ELEMENT_NODE) {
- return 'rgb(255, 255, 255)';
- }
- return getComputedStyle(element).backgroundColor;
-
- case "fontname":
- return style.fontFamily;
-
- case "forecolor":
- return style.color;
-
- default:
- return "";
- }*/
+ return "";
}
--- a/source.html Wed Apr 06 14:26:08 2011 -0600
+++ b/source.html Thu Apr 07 13:13:00 2011 -0600
@@ -199,14 +199,14 @@
"inline-table".
<p class=XXX>Currently when we hit an unwrappable element, we ignore it and
-style its children. Alternatively, if we would otherwise create a span with a
+alter its children. Alternatively, if we would otherwise create a span with a
style element on it, maybe we could put the style element directly on the
unwrappable element. This would produce shorter markup in many cases, but
would also cause problems for things like background-color that do something
different on block elements.
-<p>The <dfn>effective style</dfn> of a [[node]] <var>node</var> for a given
-<var>property</var> is returned by the following algorithm, which will return
+<p>The <dfn>effective value</dfn> of a [[node]] <var>node</var> for a given
+<var>command</var> is returned by the following algorithm, which will return
either a string or null:
<ol>
@@ -217,9 +217,9 @@
null.
<li>If <var>node</var> is a [[text]] node, return the <span>effective
- style</span> of its [[parent]] for <var>property</var>.
+ value</span> of its [[parent]] for <var>command</var>.
- <li>If <var>property</var> is "background-color":
+ <li>If <var>command</var> is "hiliteColor":
<ol>
<li>While the computed style of "background-color" on <var>node</var> is
@@ -233,18 +233,12 @@
<var>node</var>.
</ol>
- <li>If <var>property</var> is "text-decoration", and the "text-decoration"
+ <li>If <var>command</var> is "underline", and the "text-decoration"
property of <var>node</var> or any of its [[ancestors]] computes to
- "underline", return "underline". Otherwise, return "none".
+ a value containing "underline", return "underline". Otherwise, return
+ "none".
- <p class=XXX>We ignore the possibility of text-decorations other than
- underline for now, so we pretend that there are only two possible values:
- "underline" and "none".
-
- <li>If <var>property</var> is "vertical-align":
-
- <p class=XXX>We massively abuse this property. Maybe we shouldn't be using
- the CSS names here.
+ <li>If <var>command</var> is "subscript" or "superscript":
<ol>
<li>Let <var>affected by subscript</var> and <var>affected by
@@ -276,24 +270,19 @@
<li>Return "baseline".
</ol>
- <li>Return the computed style of <var>property</var> for <var>node</var>.
+ <li>Return the computed style for <var>node</var> of the <span>relevant CSS
+ property</span> for <var>command</var>.
</ol>
-<p>The <dfn>specified style</dfn> of an [[element]] for a given
-<var>property</var> is returned by the following algorithm, which will return
-either a CSS value or null:
+<p>The <dfn>specified value</dfn> of an [[element]] for a given
+<var>command</var> is returned by the following algorithm, which will return
+either a string or null:
<ol>
- <li>If <var>property</var> is "background-color" and the [[element]]'s
- display property does not compute to "inline", return null. <!-- This is
- because we currently only use background-color for hiliteColor, which we only
- want to work as a highlight. In CSS terms, this means that we only want to
- consider backgrounds that are applied to inline boxes. Roughly speaking,
- "specified style" means "style we're able to change", and we don't change
- non-inline background-colors. Maybe the name "specified style" is
- misleading, though. -->
+ <li>If <var>command</var> is "hiliteColor" and the [[element]]'s
+ display property does not compute to "inline", return null.
- <li>If <var>property</var> is "vertical-align":
+ <li>If <var>command</var> is "subscript" or "superscript":
<ol>
<li>If the computed value of the [[element]]'s "display" property is
@@ -310,15 +299,18 @@
<li>Return null.
</ol>
- <li>If the [[element]] has a <code data-anolis-spec=html
- title="the style attribute">style</code> attribute set, and that attribute has
+ <li>Let <var>property</var> be the <span>relevant CSS property</span> for
+ <var>command</var>.
+
+ <li>If <var>property</var> is null, return null.
+
+ <li>If the [[element]] has a [[style]] attribute set, and that attribute has
the effect of setting <var>property</var>, return the value that it sets
<var>property</var> to.
- <li>If the [[element]] is a <code data-anolis-spec=html>font</code> element
- that has an attribute whose effect is to create a [[presentationalhint]] for
- <var>property</var>, return the value that the hint sets <var>property</var>
- to.
+ <li>If the [[element]] is a [[font]] element that has an attribute whose
+ effect is to create a [[presentationalhint]] for <var>property</var>, return
+ the value that the hint sets <var>property</var> to.
<li>If the [[element]] is in the following list, and <var>property</var> is
equal to the CSS property name listed for it, return the string listed for
@@ -340,20 +332,12 @@
<li>Return null.
</ol>
-<p>A <dfn>styling element</dfn> is a [[b]], [[em]], [[i]], [[span]],
+<p>A <dfn>modifiable element</dfn> is a [[b]], [[em]], [[i]], [[span]],
[[strong]], [[sub]], [[sup]], or [[u]] element with no attributes except
possibly [[style]], or a [[font]] element with no attributes except possibly
[[style]], [[fontcolor]], [[fontface]], and/or [[fontsize]].
-<p class=note>Conceptually, a <span>styling element</span> is a phrasing
-element whose only purpose is to style text. Thus changing around styling
-elements (such as moving them, breaking them up, deleting them, or switching
-them with other styling elements) is fine as long as the style is preserved.
-In fact, some styling elements are supposed to have semantics other than
-styling, but the algorithms here treat them as styling elements anyway, for
-compatibility with legacy user-agents that treat them that way.
-
-<p>A <dfn>simple styling element</dfn> is an <span>HTML element</span> for
+<p>A <dfn>simple modifiable element</dfn> is an <span>HTML element</span> for
which at least one of the following holds:
<ul>
@@ -389,9 +373,9 @@
(including invalid or unrecognized properties).
</ul>
-<p class=note>Conceptually, a <span>simple styling element</span> is a
-<span>styling element</span> which <span title="specified
-style">specifies</span> at most one CSS property.
+<p class=note>Conceptually, a simple modifiable element is a modifiable element
+which <span title="specified value">specifies</span> a value for at most one
+command.
<p>When the user agent is to move a [[node]] to a new location, <dfn>preserving
ranges</dfn>, it must remove the [[node]] from its original [[parent]], then
@@ -487,31 +471,31 @@
</ol>
-<h2>Clearing an element's styles</h2>
-<p>When a user agent is to <dfn>clear styles</dfn> on an element, it must run
+<h2>Clearing an element's value</h2>
+<p>When a user agent is to <dfn>clear the value</dfn> of an element, it must run
the following steps:
-<p class=note>Clearing styles can remove it from its parent and put other nodes
-in its place. When implementations do something like clear style on all
-children of an element, they should take care not to assume that the set of
-children won't change as they're unstyled. If the element is removed, the
-algorithm will return the list of nodes inserted in its place.
+<p class=note>Clearing the value of an element can remove it from its parent
+and put other nodes in its place. When implementations do something like clear
+the value of all children of an element, they should take care not to assume
+that the set of children won't change as they're cleared. If the element is
+removed, the algorithm will return the list of nodes inserted in its place.
<!-- If we wanted to be extra-pedantic, we could convert, e.g., <font color=red
id=foo> into <span id=foo> instead of <font id=foo>, but probably not worth it.
-->
<ol>
- <li>Let <var>element</var> be the [[element]] to be unstyled.
+ <li>Let <var>element</var> be the [[element]] to be cleared.
- <li>Let <var>property</var> be as in the invoking algorithm.
+ <li>Let <var>command</var> be as in the invoking algorithm.
- <li>If <var>element</var>'s <span>specified style</span> for
- <var>property</var> is null, return the empty list. <!-- We want to abort
+ <li>If <var>element</var>'s <span>specified value</span> for
+ <var>command</var> is null, return the empty list. <!-- We want to abort
early so that we don't try unsetting background-color on a non-inline
element. -->
- <li>If <var>element</var> is a <span>simple styling element</span>:
+ <li>If <var>element</var> is a <span>simple modifiable element</span>:
<ol>
<li>Let <var>children</var> be the [[children]] of <var>element</var>.
@@ -529,27 +513,27 @@
<li>Return <var>children</var>.
</ol>
- <li>Unset the CSS property <var>property</var> of <var>element</var>.
+ <li>Let <var>property</var> be the <span>relevant CSS property</span> for
+ <var>command</var>.
- <li>If <var>element</var> is a <code data-anolis-spec=html>font</code>
- element:
+ <li>If <var>property</var> is not null, unset the CSS property
+ <var>property</var> of <var>element</var>.
+
+ <li>If <var>element</var> is a [[font]] element:
<ol>
<li>If <var>property</var> is "color", unset <var>element</var>'s
- <code data-anolis-spec=html title=dom-font-color>color</code> attribute, if
- set.
+ [[fontcolor]] attribute, if set.
<li>If <var>property</var> is "font-family", unset
- <var>element</var>'s <code data-anolis-spec=html
- title=dom-font-face>face</code> attribute, if set.
+ <var>element</var>'s [[fontface]] attribute, if set.
<li>If <var>property</var> is "font-size", unset <var>element</var>'s
- <code data-anolis-spec=html title=dom-font-size>size</code> attribute, if
- set.
+ [[fontsize]] attribute, if set.
</ol>
- <li>If <var>element</var>'s <span>specified style</span> for
- <var>property</var> is null, return the empty list.
+ <li>If <var>element</var>'s <span>specified value</span> for
+ <var>command</var> is null, return the empty list.
<!-- If we get past this step, we're something like <b class=foo> where we
want to keep the extra attributes, so we stick them on a span. -->
@@ -573,9 +557,9 @@
</ol>
-<h2>Pushing down styles</h2>
-<p>When a user agent is to <dfn>push down styles</dfn> to a [[node]]
-<var>node</var>, given a CSS property name <var>property</var> and a new value
+<h2>Pushing down values</h2>
+<p>When a user agent is to <dfn>push down values</dfn> to a [[node]]
+<var>node</var>, given a command <var>command</var> and a new value
<var>new value</var>, it must run the following steps:
<div class=XXX>
@@ -614,7 +598,7 @@
<li>If <var>node</var>'s [[parent]] is not an [[element]], abort this
algorithm. <!-- E.g., a text node child of a document fragment. -->
- <li>If the <span>effective style</span> of <var>property</var> is <var>new
+ <li>If the <span>effective value</span> of <var>command</var> is <var>new
value</var> on <var>node</var>, abort this algorithm.
<li>Let <var>current ancestor</var> be <var>node</var>'s [[parent]].
@@ -622,22 +606,24 @@
<li>Let <var>ancestor list</var> be a list of [[nodes]], initially empty.
<li>While <var>current ancestor</var> is an [[element]] and the
- <span>effective style</span> of <var>property</var> is not <var>new
+ <span>effective value</span> of <var>property</var> is not <var>new
value</var> on it, append <var>current ancestor</var> to <var>ancestor
list</var>, then set <var>current ancestor</var> to its [[parent]].
- <!-- We can only remove specified styles, so if the style isn't specified,
+ <li>If <var>ancestor list</var> is empty, abort this algorithm.
+
+ <li>Let <var>propagated value</var> be the <span>specified value</span> of
+ <var>command</var> on the last member of <var>ancestor list</var>.
+
+ <!-- We can only remove specified values, so if the value isn't specified,
give up. -->
- <li>If <var>ancestor list</var> is not empty, and the <span>specified
- style</span> of <var>property</var> on the last member of <var>ancestor
- list</var> is null, abort this algorithm.
+ <li>If <var>propagated value</var> is null, abort this algorithm.
<!-- If we go all the way up to the root and still don't have the desired
- style, pushing down styles is pointless. It will create extra markup for no
+ value, pushing down values is pointless. It will create extra markup for no
purpose. -->
- <li>If <var>ancestor list</var> is not empty, and the [[parent]] of the last
- member of <var>ancestor list</var> is not an [[element]], abort this
- algorithm.
+ <li>If the [[parent]] of the last member of <var>ancestor list</var> is not
+ an [[element]], abort this algorithm.
<li>While <var>ancestor list</var> is not empty:
@@ -647,16 +633,14 @@
<li>Remove the last member from <var>ancestor list</var>.
- <li>Let <var>propagated value</var> be the <span>specified style</span> of
- <var>current ancestor</var> for <var>property</var>.
-
- <li>If <var>propagated value</var> is null, continue this loop from the
- beginning.
+ <li>If the <span>specified value</span> of <var>current ancestor</var> for
+ <var>command</var> is not null, set <var>propagated value</var> to that
+ value.
<li>Let <var>children</var> be the [[children]] of <var>current
ancestor</var>.
- <li><span>Clear styles</span> on <var>current ancestor</var>.
+ <li><span>Clear the value</span> of <var>current ancestor</var>.
<li>For every <var>child</var> in <var>children</var>:
@@ -665,35 +649,32 @@
<var>child</var>.
<li>If <var>child</var> is an [[element]] whose <span>specified
- style</span> for <var>property</var> is neither null nor equal to
+ value</span> for <var>command</var> is neither null nor equal to
<var>propagated value</var>, continue with the next <var>child</var>.
<li>If <var>child</var> is the last member of <var>ancestor list</var>,
- set <var>child</var>'s CSS property <var>property</var> to
- <var>propagated value</var> and continue with the next <var>child</var>.
+ continue with the next <var>child</var>.
- <p class=note>This style will be removed on the next loop iteration and
- distributed to its children.
-
- <li><span>Force the style</span> of <var>child</var>, with
- <var>property</var> as in this algorithm and <var>new value</var> equal
+ <li><span>Force the value</span> of <var>child</var>, with
+ <var>command</var> as in this algorithm and <var>new value</var> equal
to <var>propagated value</var>.
</ol>
</ol>
</ol>
-<h2>Forcing the style of a node</h2>
-<p>When a user agent is to <dfn>force the style</dfn> of a [[node]]
-<var>node</var>, given a CSS property name <var>property</var> and a new value
+<h2>Forcing the value of a node</h2>
+<p>When a user agent is to <dfn>force the value</dfn> of a [[node]]
+<var>node</var>, given a command <var>command</var> and a new value
<var>new value</var>, it must run the following steps.
-<p class=note>This algorithm checks if the node has the desired style, and if
+<p class=note>This algorithm checks if the node has the desired value, and if
not, it wraps the node (or, if that's not possible, its descendants) in a
-<span>simple styling element</span>. This is only used as a last resort after
-<span title="clear styles">clearing styles</span> and <span title="push down
-styles">pushing down styles</span> don't work to achieve the desired style.
-After forcing the style, descendants might still have different style.
+<span>simple modifiable element</span>. This is only used as a last resort
+after <span title="clear the value">clearing the value</span> and <span
+title="push down values">pushing down values</span> don't work to achieve the
+desired value. After forcing the value, descendants might still have a
+different value.
<ol>
<li>If <var>node</var>'s [[parent]] is null, abort this algorithm.
@@ -703,7 +684,7 @@
element</span>:
<ol>
- <!-- Even if the style matches, we stick it in a preceding sibling if
+ <!-- Even if the value matches, we stick it in a preceding sibling if
possible. This ensures "a<cite>b</cite>c" -> "<i>a<cite>b</cite>c</i>"
instead of "<i>a</i><cite>b</cite><i>c</i>". While we're at it, we also
handle more elaborate cases like <b>foo</b>[bar]<b>baz</b> and even
@@ -715,16 +696,16 @@
care, since the resulting style will still be right. -->
<li>Let <var>candidate</var> be <var>node</var>'s [[previoussibling]].
- <li>While <var>candidate</var> is a <span>styling element</span>, and
+ <li>While <var>candidate</var> is a <span>modifiable element</span>, and
<var>candidate</var> has exactly one [[child]], and that [[child]] is also
- a <span>styling element</span>, and <var>candidate</var> is not a
- <span>simple styling element</span> or <var>candidate</var>'s
- <span>specified style</span> for <var>property</var> is not <var>new
+ a <span>modifiable element</span>, and <var>candidate</var> is not a
+ <span>simple modifiable element</span> or <var>candidate</var>'s
+ <span>specified value</span> for <var>command</var> is not <var>new
value</var>, set <var>candidate</var> to its [[child]].
- <li>If <var>candidate</var> is a <span>simple styling element</span> whose
- <span>specified style</span> and <span>effective style</span> for
- <var>property</var> are both <var>new value</var>, and <var>candidate</var>
+ <li>If <var>candidate</var> is a <span>simple modifiable element</span>
+ whose <span>specified value</span> and <span>effective value</span> for
+ <var>command</var> are both <var>new value</var>, and <var>candidate</var>
is not the [[previoussibling]] of <var>node</var>:
<ol>
@@ -747,16 +728,16 @@
<li>Let <var>candidate</var> be <var>node</var>'s [[nextsibling]].
- <li>While <var>candidate</var> is a <span>styling element</span>, and
+ <li>While <var>candidate</var> is a <span>modifiable element</span>, and
<var>candidate</var> has exactly one [[child]], and that [[child]] is also
- a <span>styling element</span>, and <var>candidate</var> is not a
- <span>simple styling element</span> or <var>candidate</var>'s
- <span>specified style</span> for <var>property</var> is not <var>new
+ a <span>modifiable element</span>, and <var>candidate</var> is not a
+ <span>simple modifiable element</span> or <var>candidate</var>'s
+ <span>specified value</span> for <var>command</var> is not <var>new
value</var>, set <var>candidate</var> to its [[child]].
- <li>If <var>candidate</var> is a <span>simple styling element</span> whose
- <span>specified style</span> and <span>effective style</span> for
- <var>property</var> are both <var>new value</var>, and <var>candidate</var>
+ <li>If <var>candidate</var> is a <span>simple modifiable element</span>
+ whose <span>specified value</span> and <span>effective value</span> for
+ <var>command</var> are both <var>new value</var>, and <var>candidate</var>
is not the [[nextsibling]] of <var>node</var>:
<ol>
@@ -778,20 +759,20 @@
<li>Let <var>previous sibling</var> and <var>next sibling</var> be
<var>node</var>'s [[previoussibling]] and [[nextsibling]].
- <li>If <var>previous sibling</var> is a <span>simple styling element</span>
- whose <span>specified style</span> and <span>effective style</span> for
- <var>property</var> are both <var>new value</var>, append <var>node</var>
- as the last [[child]] of <var>previous sibling</var>, <span>preserving
- ranges</span>.
+ <li>If <var>previous sibling</var> is a <span>simple modifiable
+ element</span> whose <span>specified value</span> and <span>effective
+ value</span> for <var>command</var> are both <var>new value</var>, append
+ <var>node</var> as the last [[child]] of <var>previous sibling</var>,
+ <span>preserving ranges</span>.
- <li>If <var>next sibling</var> is a <span>simple styling element</span>
- whose <span>specified style</span> and <span>effective style</span> for
- <var>property</var> are both <var>new value</var>:
+ <li>If <var>next sibling</var> is a <span>simple modifiable element</span>
+ whose <span>specified value</span> and <span>effective value</span> for
+ <var>command</var> are both <var>new value</var>:
<ol>
<li>If <var>node</var> is not a [[child]] of <var>previous sibling</var>,
- insert <var>node</var> as the first [[child]] of <var>next
- sibling</var>, <span>preserving ranges</span>.
+ insert <var>node</var> as the first [[child]] of <var>next sibling</var>,
+ <span>preserving ranges</span>.
<li>Otherwise, while <var>next sibling</var> has [[children]], append the
first [[child]] of <var>next sibling</var> as the last [[child]] of
@@ -800,18 +781,18 @@
</ol>
</ol>
- <li>If the <span>effective style</span> of <var>property</var> is <var>new
+ <li>If the <span>effective value</span> of <var>command</var> is <var>new
value</var> on <var>node</var>, abort this algorithm.
<li>If <var>node</var> is an <span>unwrappable element</span>:
<ol>
<li>Let <var>children</var> be all [[children]] of <var>node</var>,
- omitting any that are [[element]]s whose <span>specified style</span> for
- <var>property</var> is neither null nor equal to <var>new value</var>.
+ omitting any that are [[element]]s whose <span>specified value</span> for
+ <var>command</var> is neither null nor equal to <var>new value</var>.
- <li><span>Force the style</span> of each [[node]] in <var>children</var>,
- with <var>property</var> and <var>new value</var> as in this invocation of
+ <li><span>Force the value</span> of each [[node]] in <var>children</var>,
+ with <var>command</var> and <var>new value</var> as in this invocation of
the algorithm.
<!-- This means that if it has no children, we do nothing. IE9 inserts an
empty wrapper element in that case, but I'm not sure what the point is, and
@@ -827,7 +808,7 @@
<li>If <var>node</var> is a [[comment]] or [[processinginstruction]], abort
this algorithm.
- <li>If the <span>effective style</span> of <var>property</var> is <var>new
+ <li>If the <span>effective value</span> of <var>command</var> is <var>new
value</var> on <var>node</var>, abort this algorithm.
<li>Let <var>new parent</var> be null.
@@ -835,25 +816,25 @@
<li>If the <span>CSS styling flag</span> is false:
<ol>
- <li>If <var>property</var> is "font-weight" and <var>new value</var> is
+ <li>If <var>command</var> is "bold" and <var>new value</var> is
"bold", let <var>new parent</var> be the result of calling <code
data-anolis-spec=domcore
title=dom-Document-createElement>createElement("b")</code> on the
[[ownerdocument]] of <var>node</var>.
- <li>If <var>property</var> is "font-style" and <var>new value</var> is
+ <li>If <var>command</var> is "italic" and <var>new value</var> is
"italic", let <var>new parent</var> be the result of calling <code
data-anolis-spec=domcore
title=dom-Document-createElement>createElement("i")</code> on the
[[ownerdocument]] of <var>node</var>.
- <li>If <var>property</var> is "text-decoration" and <var>new value</var> is
+ <li>If <var>command</var> is "underline" and <var>new value</var> is
"underline", let <var>new parent</var> be the result of calling <code
data-anolis-spec=domcore
title=dom-Document-createElement>createElement("u")</code> on the
[[ownerdocument]] of <var>node</var>.
- <li>If <var>property</var> is "color", let <var>new parent</var> be the
+ <li>If <var>command</var> is "foreColor", let <var>new parent</var> be the
result of calling <code data-anolis-spec=domcore
title=dom-Document-createElement>createElement("font")</code> on the
[[ownerdocument]] of <var>node</var>, then set the [[fontcolor]] attribute
@@ -863,13 +844,13 @@
We also need to specify exactly how it's serialized, since CSSOM doesn't
cover this. It might be best to always output simple colors.
- <li>If <var>property</var> is "font-family", let <var>new parent</var> be
+ <li>If <var>command</var> is "fontName", let <var>new parent</var> be
the result of calling <code data-anolis-spec=domcore
title=dom-Document-createElement>createElement("font")</code> on the
[[ownerdocument]] of <var>node</var>, then set the [[fontface]] attribute
of <var>new parent</var> to <var>new value</var>.
- <li>If <var>property</var> is "font-size", let <var>new parent</var> be the
+ <li>If <var>command</var> is "fontSize", let <var>new parent</var> be the
result of calling <code data-anolis-spec=domcore
title=dom-Document-createElement>createElement("font")</code> on the
[[ownerdocument]] of <var>node</var>, then set the [[fontsize]] attribute
@@ -877,16 +858,16 @@
</ol>
<!-- We always use sup/sub elements, even in CSS mode, following Gecko and
- contradicting WebKit. This is because <span style="vertical-align:
+ contradicting WebKit. This is because <span value="vertical-align:
sub/super">, the obvious equivalent (and what WebKit uses), behaves quite
differently: it doesn't reduce font-size, which is ugly. -->
- <li>If <var>property</var> is "vertical-align" and <var>new value</var> is
+ <li>If <var>command</var> is "subscript" and <var>new value</var> is
"sub", let <var>new parent</var> be the result of calling <code
data-anolis-spec=domcore
title=dom-Document-createElement>createElement("sub")</code> on the
[[ownerdocument]] of <var>node</var>.
- <li>If <var>property</var> is "vertical-align" and <var>new value</var> is
+ <li>If <var>command</var> is "superscript" and <var>new value</var> is
"super", let <var>new parent</var> be the result of calling <code
data-anolis-spec=domcore
title=dom-Document-createElement>createElement("sup")</code> on the
@@ -901,15 +882,16 @@
<var>node</var>. <!-- This preserves boundary points correctly, as usual.
-->
- <li>If the <span>effective style</span> of <var>property</var> for <var>new
- parent</var> is not <var>new value</var>, set the CSS property
- <var>property</var> of <var>new parent</var> to <var>new value</var>.
+ <li>If the <span>effective value</span> of <var>command</var> for <var>new
+ parent</var> is not <var>new value</var>, and the <span>relevant CSS
+ property</span> for <var>command</var> is not null, set that CSS property of
+ <var>new parent</var> to <var>new value</var>.
<li>Append <var>node</var> to <var>new parent</var> as its last [[child]],
<span>preserving ranges</span>.
- <li>If <var>node</var> is an [[element]] and the <span>effective style</span>
- of <var>property</var> for <var>node</var> is not <var>new value</var>:
+ <li>If <var>node</var> is an [[element]] and the <span>effective value</span>
+ of <var>command</var> for <var>node</var> is not <var>new value</var>:
<ol>
<li>Insert <var>node</var> into the [[parent]] of <var>new parent</var>
@@ -917,28 +899,29 @@
<li>Remove <var>new parent</var> from its [[parent]].
- <li>If <var>new parent</var> is a [[span]], set the CSS property
- <var>property</var> of <var>node</var> to <var>new value</var>.
+ <li>If <var>new parent</var> is a [[span]], and the <span>relevant CSS
+ property</span> for <var>command</var> is not null, set that CSS property
+ of <var>node</var> to <var>new value</var>.
<li>Otherwise:
<ol>
<li>Let <var>children</var> be all [[children]] of <var>node</var>,
- omitting any that are [[element]]s whose <span>specified style</span> for
- <var>property</var> is neither null nor equal to <var>new value</var>.
+ omitting any that are [[element]]s whose <span>specified value</span> for
+ <var>command</var> is neither null nor equal to <var>new value</var>.
- <li><span>Force the style</span> of each [[node]] in <var>children</var>,
- with <var>property</var> and <var>new value</var> as in this invocation
+ <li><span>Force the value</span> of each [[node]] in <var>children</var>,
+ with <var>command</var> and <var>new value</var> as in this invocation
of the algorithm.
</ol>
</ol>
</ol>
-<h2>Styling a node</h2>
-<p>When a user agent is to <dfn>style</dfn> a [[node]] <var>node</var>, it must
-run the following steps. There are two inputs: a CSS property name
-<var>property</var> and a new value <var>new value</var>.
+<h2>Setting the value of a node</h2>
+<p>When a user agent is to <dfn>set the value</dfn> of a [[node]]
+<var>node</var>, it must run the following steps. There are two inputs: a
+command <var>command</var> and a new value <var>new value</var>.
<div class=note>
<p>The effect of this algorithm is to ensure that the node and all its
@@ -952,7 +935,7 @@
<p>First, if the node is an element with an inline style rule for this
property, we unset it ("clearing styles"). This step also removes <span
-title="simple styling element">simple styling elements</span> entirely, and
+title="simple modifiable element">simple modifiable elements</span> entirely, and
replaces elements like [[b]] or [[font]] with [[span]]s if they aren't simple
styling elements. This will be sufficient if the desired style is inherited
from an ancestor, or if it's the default (like font-style: normal) and no
@@ -983,7 +966,7 @@
<p>Finally, if neither of the above strategies worked, we have to add new
markup to get the desired style ("forcing styles"). First we try just sticking
-it into its previous or next sibling, if that's a <span>simple styling
+it into its previous or next sibling, if that's a <span>simple modifiable
element</span> (so it won't add any styles or semantics we don't want).
Otherwise, we create a new simple styling element and wrap it in that. It's
common that a previous sibling is the simple styling element we want, because
@@ -1008,12 +991,12 @@
</div>
<ol>
- <li>If <var>node</var> is a [[document]], <span>style</span> its [[element]]
- [[child]] (if it has one) and abort this algorithm.
+ <li>If <var>node</var> is a [[document]], <span>set the value</span> of its
+ [[element]] [[child]] (if it has one) and abort this algorithm.
<li>If <var>node</var> is a [[documentfragment]], let <var>children</var> be
- a list of its [[children]]. <span>Style</span> each member of [[children]],
- then abort this algorithm.
+ a list of its [[children]]. <span>Set the value</span> of each member of
+ [[children]], then abort this algorithm.
<li>If <var>node</var>'s [[parent]] is null, or if <var>node</var> is a <code
data-anolis-spec=domcore>DocumentType</code>, abort this algorithm.
@@ -1025,23 +1008,23 @@
<li>If <var>node</var> is an [[element]]:
<ol>
- <li><span>Clear styles</span> on <var>node</var>, and let <var>new
+ <li><span>Clear the value</span> of <var>node</var>, and let <var>new
nodes</var> be the result.
<li>For each <var>new node</var> in <var>new nodes</var>,
- <span>style</span> <var>new node</var>, with the same inputs as this
- invocation of the algorithm.
+ <span>set the value</span> of <var>new node</var>, with the same inputs as
+ this invocation of the algorithm.
<li>If <var>node</var>'s [[parent]] is null, abort this algorithm.
</ol>
- <li><span>Push down styles</span> on <var>node</var>.
+ <li><span>Push down values</span> on <var>node</var>.
- <li><span>Force the style</span> of <var>node</var>.
+ <li><span>Force the value</span> of <var>node</var>.
<li>Let <var>children</var> be the [[children]] of <var>node</var>.
- <li><span>Style</span> each member of <var>children</var>.
+ <li><span>Set the value</span> of each member of <var>children</var>.
<p class=note>Styling a node involves clearing its styles, which can remove
it from the tree. Implementers should be careful to compute the list of
@@ -1096,7 +1079,9 @@
<p>The possible values for <var>commandId</var>, and their corresponding
meanings, are as follows. These values must be compared to the argument in an
-<span data-anolis-spec=domcore>ASCII case-insensitive</span> manner.
+<span data-anolis-spec=domcore>ASCII case-insensitive</span> manner. The
+<dfn>relevant CSS property</dfn> of a command is defined here, and is null if
+omitted for a particular command.
<!-- Notes on commands I've looked at but haven't bothered specifying yet:
@@ -1153,14 +1138,14 @@
<dt><code title><dfn title=command-bold>bold</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
-state of the [[range]] for this command is then true, <span>style</span> each
-returned [[node]] with <var>property</var> "font-weight" and <var>new
-value</var> "normal". Otherwise, <span>style</span> them with <var>new
+state of the [[range]] for this command is then true, <span>set the
+value</span> of each returned [[node]] with <var>new value</var> "normal".
+Otherwise, <span title="set the value">set their value</span> with <var>new
value</var> "bold".
<dd><strong>State</strong>: True if every [[text]] node that is
<span>effectively contained</span> in the [[range]] has <span>effective
-style</span> either null or at least 700 for font-weight. Otherwise false.
+value</span> either null or at least 700. Otherwise false.
<!-- For bold and similar commands, IE 9 RC seems to consider the state true or
false depending on the first element. All other browsers follow the same
general idea as the spec, considering a range bold only if all text in it is
@@ -1175,6 +1160,8 @@
string, and three out of the four return something that evaluates to false as a
boolean, so I'll go with Firefox and Opera. -->
+<dd><strong>Relevant CSS Property</strong>: "font-weight"
+
<dt><code title><dfn title=command-createlink>createLink</dfn></code>
@@ -1268,8 +1255,8 @@
<dt><code title><dfn title=command-fontname>fontName</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]], then
-<span>style</span> each returned [[node]] with <var>property</var> equal to
-"font-family" and <var>new value</var> equal to <var>value</var>.
+<span>set the value</span> of each returned [[node]] with <var>new value</var>
+equal to <var>value</var>.
<!-- UAs differ a bit in the details here:
IE 9 RC: Empty string sets <font face="">
@@ -1312,6 +1299,8 @@
font-family. I'll leave CSSOM to decide what that means if there are no
applicable style rules. -->
+<dd><strong>Relevant CSS Property</strong>: "font-family"
+
<dt><code title><dfn title=command-forecolor>foreColor</dfn></code>
@@ -1331,9 +1320,9 @@
except in Opera, which tries to parse it in some crazy way and winds up with
"#00b025". rgba() colors don't work as uniformly, but I don't see any reason
to prohibit them. Best to just match CSS. -->
-Otherwise, it must <span>decompose</span> the [[range]], then
-<span>style</span> each returned [[node]] with <var>property</var> equal to
-"color" and <var>new value</var> equal to <var>value</var>.
+Otherwise, it must <span>decompose</span> the [[range]], then <span>set the
+value</span> of each returned [[node]] with <var>new value</var> equal to
+<var>value</var>.
<dd><strong>State</strong>: Always false.
<!-- This matches IE 9 RC and Chrome 10. Opera 11 seems to return true if
@@ -1342,10 +1331,10 @@
which is an interesting approach, but I'll go with IE/WebKit, which makes at
least as much sense. -->
-<dd><strong>Value</strong>: The computed value of the CSS property "color"
-for . . .
-<!-- IE 9 RC returns the number 0 always, which makes no sense at all. This
-matches the other browsers. -->
+<dd><strong>Value</strong>:
+<!-- IE 9 RC returns the number 0 always, which makes no sense at all. -->
+
+<dd><strong>Relevant CSS Property</strong>: "color"
<dt><code title><dfn title=command-hiliteColor>hiliteColor</dfn></code>
@@ -1366,14 +1355,14 @@
<dd><strong>Action</strong>: If <var>value</var> is not a valid CSS color,
do nothing and abort these steps. Otherwise, <span>decompose</span> the
-[[range]], then <span>style</span> each returned [[node]] with
-<var>property</var> equal to "background-color" and <var>new value</var> equal
-to <var>value</var>.
+[[range]], then <span>set the value</span> of each returned [[node]] with
+<var>new value</var> equal to <var>value</var>.
<dd><strong>State</strong>: Always false.
-<dd><strong>Value</strong>: The <span>effective style</span> for
-"background-color" on . . .
+<dd><strong>Value</strong>:
+
+<dd><strong>Relevant CSS Property</strong>: "background-color"
<dt><code title><dfn title=command-insertimage>insertImage</dfn></code>
@@ -1427,18 +1416,19 @@
<dt><code title><dfn title=command-italic>italic</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
-state of the [[range]] for this command is then true, <span>style</span> each
-returned [[node]] with <var>property</var> "font-style" and <var>new
-value</var> "normal". Otherwise, <span>style</span> them with <var>new
+state of the [[range]] for this command is then true, <span>set the
+value</span> of each returned [[node]] with <var>new value</var> "normal".
+Otherwise, <span title="set the value">set their value</span> with <var>new
value</var> "italic".
<dd><strong>State</strong>: True if every [[text]] node that is
<span>effectively contained</span> in the [[range]] has <span>effective
-style</span> either null, "italic", or "oblique" for font-style. Otherwise
-false.
+value</span> either null, "italic", or "oblique". Otherwise false.
<dd><strong>Value</strong>: Always the empty string.
+<dd><strong>Relevant CSS Property</strong>: "font-style"
+
<dt><code title><dfn title=command-stylewithcss>styleWithCSS</dfn></code>
@@ -1457,41 +1447,47 @@
<dt><code title><dfn title=command-subscript>subscript</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
-state of the [[range]] for this command is then true, <span>style</span> each
-returned [[node]] with <var>property</var> "vertical-align" and <var>new
-value</var> "baseline". Otherwise, <span>style</span> them with <var>new
+state of the [[range]] for this command is then true, <span>set the
+value</span> of each returned [[node]] with <var>new value</var> "baseline".
+Otherwise, <span title="set the value">set their value</span> with <var>new
value</var> "baseline", then <span>decompose</span> the [[range]] again and
-<span>style</span> each returned [[node]] with <var>new value</var> "sub".
+<span>set the value</span> of each returned [[node]] with <var>new value</var>
+"sub".
<dd><strong>State</strong>: True if every [[text]] node that is
<span>effectively contained</span> in the [[range]] has <span>effective
-style</span> either null or "sub" for "vertical-align". Otherwise false.
+value</span> either null or "sub". Otherwise false.
<dd><strong>Value</strong>:
+<dd><strong>Relevant CSS Property</strong>: "vertical-align"
+
<dt><code title><dfn title=command-superscript>superscript</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
-state of the [[range]] for this command is then true, <span>style</span> each
-returned [[node]] with <var>property</var> "vertical-align" and <var>new
-value</var> "baseline". Otherwise, <span>style</span> them with <var>new
+state of the [[range]] for this command is then true, <span>set the
+value</span> of each returned [[node]] with <var>new value</var> "baseline".
+Otherwise, <span title="set the value">set their value</span> with <var>new
value</var> "baseline", then <span>decompose</span> the [[range]] again and
-<span>style</span> each returned [[node]] with <var>new value</var> "super".
+<span>set the value</span> of each returned [[node]] with <var>new value</var>
+"super".
<dd><strong>State</strong>: True if every [[text]] node that is
<span>effectively contained</span> in the [[range]] has <span>effective
-style</span> either null or "super" for "vertical-align". Otherwise false.
+value</span> either null or "super". Otherwise false.
<dd><strong>Value</strong>:
+<dd><strong>Relevant CSS Property</strong>: "vertical-align"
+
<dt><code title><dfn title=command-underline>underline</dfn></code>
<dd><strong>Action</strong>: <span>Decompose</span> the [[range]]. If the
-state of the [[range]] for this command is then true, <span>style</span> each
-returned [[node]] with <var>property</var> "text-decoration" and <var>new
-value</var> "none". Otherwise, <span>style</span> them with <var>new
+state of the [[range]] for this command is then true, <span>set the
+value</span> of each returned [[node]] with <var>new value</var> "none".
+Otherwise, <span title="set the value">set their value</span> with <var>new
value</var> "underline".
<div class=XXX>
@@ -1547,10 +1543,12 @@
<dd><strong>State</strong>: True if every [[text]] node that is
<span>effectively contained</span> in the [[range]] has <span>effective
-style</span> either null or "underline" for text-decoration. Otherwise false.
+value</span> either null or "underline". Otherwise false.
<dd><strong>Value</strong>: Always the empty string.
+<dd><strong>Relevant CSS Property</strong>: "text-decoration"
+
<dt><code title><dfn title=command-unlink>unlink</dfn></code>
@@ -1614,7 +1612,7 @@
<dd><strong>State</strong>:
<dd><strong>Value</strong>:
-</dl>
+
<h2 class=no-num id=references>References</h2><!--REFS-->