Skip to content

Commit

Permalink
[] (1) Define outerHTML for HTML elements in HTML documents.
Browse files Browse the repository at this point in the history 
git-svn-id: http://svn.whatwg.org/webapps@2034 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
@Hixie
Hixie committed Aug 10, 2008
1 parent b6ed3dd commit 3530ce1
Show file tree
Hide file tree
Showing 2 changed files with 288 additions and 158 deletions.
252 changes: 152 additions & 100 deletions index
View file
Expand Up @@ -7633,7 +7633,7 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20html%3E..

// <a href="#dynamic3">dynamic markup insertion</a>
attribute DOMString <a href="#innerhtml" title=dom-innerHTML>innerHTML</a>;
attribute DOMString <span title=dom-outerHTML>outerHTML</span>;
attribute DOMString <a href="#outerhtml" title=dom-outerHTML>outerHTML</a>;

// <span>metadata attributes</span>
attribute DOMString <a href="#id0" title=dom-id>id</a>;
Expand Down Expand Up @@ -8702,9 +8702,10 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0

<p>The <code title=dom-document-write><a
href="#document.write">document.write()</a></code> family of methods and
the <code title=dom-innerHTML><a href="#innerhtml">innerHTML</a></code>
family of DOM attributes enable script authors to dynamically insert
markup into the document.
the <code title=dom-innerHTML><a
href="#innerhtml">innerHTML</a></code>/<code title=dom-outerHTML><a
href="#outerhtml">outerHTML</a></code> family of DOM attributes enable
script authors to dynamically insert markup into the document.

<p>Because these APIs interact with the parser, their behavior varies
depending on whether they are used with <a href="#html-">HTML
Expand All @@ -8717,28 +8718,36 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
<tr>
<td>

<th><dfn id=document.write
title=dom-document-write><code>document.write()</code></dfn>
<th>For documents that are <a href="#html-">HTML documents</a>

<th><dfn id=innerhtml title=dom-innerHTML><code>innerHTML</code></dfn>
<th>For documents that are <a href="#xml-documents">XML documents</a>

<tbody>
<tr>
<th>For documents that are <a href="#html-">HTML documents</a>
<th><dfn id=document.write
title=dom-document-write><code>document.write()</code></dfn>

<td><a href="#document.write..."
title=dom-document-write-HTML><code>document.write()</code> in HTML</a>

<td><a href="#document.write0"
title=dom-document-write-XML><code>document.write()</code> in XML</a>

<tr>
<th><dfn id=innerhtml title=dom-innerHTML><code>innerHTML</code></dfn>

<td><a href="#innerhtml0"
title=dom-innerHTML-HTML><code>innerHTML</code> in HTML</a>

<td><span title=dom-innerHTML-XML><code>innerHTML</code> in XML</span>

<tr>
<th>For documents that are <a href="#xml-documents">XML documents</a>
<th><dfn id=outerhtml title=dom-outerHTML><code>outerHTML</code></dfn>

<td><a href="#document.write0"
title=dom-document-write-XML><code>document.write()</code> in XML</a>
<td><a href="#outerhtml0"
title=dom-outerHTML-HTML><code>outerHTML</code> in HTML</a>

<td><a href="#innerhtml1" title=dom-innerHTML-XML><code>innerHTML</code>
<td><a href="#outerhtml1" title=dom-outerHTML-XML><code>outerHTML</code>
in XML</a>
</table>

Expand Down Expand Up @@ -8935,21 +8944,14 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
<p>Finally, the method must return.</p>
</ol>

<p>In HTML, the <dfn id=innerhtml0
title=dom-innerHTML-HTML><code>innerHTML</code></dfn> DOM attribute of all
<code><a href="#htmlelement">HTMLElement</a></code> and <code><a
href="#htmldocument">HTMLDocument</a></code> nodes returns a serialization
of the node's children using the <span>HTML syntax</span><!-- XXX xref
-->.
On setting, it replaces the node's children with new nodes that result
from parsing the given value. The formal definitions follow.
<hr>

<p>On getting, the <code title=dom-innerHTML-HTML><a
href="#innerhtml0">innerHTML</a></code> DOM attribute must return the
result of running the <a href="#html-fragment">HTML fragment serialization
algorithm</a> on the node.
<p>On getting, the <dfn id=innerhtml0
title=dom-innerHTML-HTML><code>innerHTML</code></dfn> DOM attribute must
return the result of running the <a href="#html-fragment">HTML fragment
serialization algorithm</a> on the node.

<p>On setting, if the node is a document, the <code
<p>On setting, <strong>if the node is a document</strong>, the <code
title=dom-innerHTML-HTML><a href="#innerhtml0">innerHTML</a></code> DOM
attribute must run the following algorithm:

Expand Down Expand Up @@ -9034,10 +9036,70 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
preserving their order.</p>
</ol>

<hr>

<p>On getting, the <dfn id=outerhtml0
title=dom-outerHTML-HTML><code>outerHTML</code></dfn> DOM attribute must
return the result of running the <a href="#html-fragment">HTML fragment
serialization algorithm</a> on a fictional node whose only child is the
node on which the attribute was invoked.

<p>On setting, the <code title=dom-outerHTML-HTML><a
href="#outerhtml0">outerHTML</a></code> DOM attribute must cause the
following algorithm to run:

<ol>
<li>
<p>Let <var title="">target</var> be the element whose <code
title=dom-innerHTML-HTML><a href="#innerhtml0">outerHTML</a></code>
attribute is being set.</p>

<li>
<p>If <var title="">target</var> has no parent node, then abort these
steps. There would be no way to obtain a reference to the nodes created
even if the remaining steps were run.</p>

<li>
<p>If <var title="">target</var>'s parent node is a <code>Document</code>
object, throw a <code>NO_MODIFICATION_ALLOWED_ERR</code> exception and
abort these steps.</p>

<li>
<p>Invoke the <a href="#html-fragment0">HTML fragment parsing
algorithm</a>, with <var title="">target</var>'s parent element as the
<var title="">context</var> element and the string being assigned into
the <code title=dom-outerHTML-HTML><a
href="#outerhtml0">outerHTML</a></code> attribute as the <var
title="">input</var>. Let <var title="">new children</var> be the result
of this algorithm.</p>

<li>
<p>Let <var title="">target document</var> be the <code
title="">ownerDocument</code> of <var title="">target</var>.</p>

<li>
<p>Set the <code title="">ownerDocument</code> of all the nodes in <var
title="">new children</var> to the <var title="">target document</var>.</p>

<li>
<p>Remove <var title="">target</var> from its parent node and insert in
its place all the <var title="">new children</var> nodes, preserving
their order.</p>
</ol>

<hr>

<p class=note>The <code title=dom-innerHTML-HTML><a
href="#innerhtml0">innerHTML</a></code> attribute applies to both
<code>Element</code> nodes as well as <code>Document</code> nodes. The
<code title=dom-outerHTML-HTML><a href="#outerhtml0">outerHTML</a></code>
attribute, on the other hand, only applies to <code>Element</code> nodes.

<p class=note><code><a href="#script1">script</a></code> elements inserted
using <code title=dom-innerHTML-HTML><a
href="#innerhtml0">innerHTML</a></code> do not execute when they are
inserted.</p>
href="#innerhtml0">innerHTML</a></code> and <code
title=dom-outerHTML-HTML><a href="#outerhtml0">outerHTML</a></code> do not
execute when they are inserted.</p>
<!-- XXX must make sure we spec that innerHTML causes mutation
events to fire, but document.write() doesn't. (the latter is already
req-stated in the parser section, btw) -->
Expand All @@ -9053,46 +9115,27 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20HTML%3E%0
<h4 id=dynamic2><span class=secno>3.7.3 </span>Dynamic markup insertion in
XML</h4>

<p>In an XML context, the <dfn id=document.write0
title=dom-document-write-XML><code>document.write()</code></dfn> method
must raise an <code>INVALID_ACCESS_ERR</code> exception.</p>
<!--
For XHTML: content must be well-formed. Where does
it insert? Immediately after the script that called document.write()?</p>
how do we handle async scripts vs sync scripts?

Consider:
data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ document.write('<foo>Test</foo>'); ]]></script>
data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ alert('test'); alert(document.write); try { document.write('<foo>Test</foo>'); alert(document.childNodes.length); } catch (e) { alert(e); } ]]></script>

-->

<p>On the other hand, however, the <dfn id=innerhtml1
title=dom-innerHTML-XML><code>innerHTML</code></dfn> attribute is indeed
usable in an XML context.

<p>In an XML context, the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> DOM attribute on <code><a
href="#htmlelement">HTMLElement</a></code>s must return a string in the
form of an <a href="http://www.w3.org/TR/xml/#wf-entities">internal
general parsed entity</a>, and on <code><a
href="#htmldocument">HTMLDocument</a></code>s must return a string in the
form of a <a href="http://www.w3.org/TR/xml/#sec-well-formed">document
entity</a>. The string returned must be XML namespace-well-formed and must
be an isomorphic serialization of all of that node's child nodes, in
document order. User agents may adjust prefixes and namespace declarations
in the serialization (and indeed might be forced to do so in some cases to
obtain namespace-well-formed XML). For the <code
title=dom-innerHTML-XML><a href="#innerhtml1">innerHTML</a></code>
attribute on <code><a href="#htmlelement">HTMLElement</a></code> objects,
if any of the elements in the serialization are in no namespace, the
default namespace in scope for those elements must be explicitly declared
as the empty string.<!-- because otherwise round-tripping might break
<p>In an XML context, the <code title=dom-innerHTML-XML>innerHTML</code>
DOM attribute on <code><a href="#htmlelement">HTMLElement</a></code>s must
return a string in the form of an <a
href="http://www.w3.org/TR/xml/#wf-entities">internal general parsed
entity</a>, and on <code><a href="#htmldocument">HTMLDocument</a></code>s
must return a string in the form of a <a
href="http://www.w3.org/TR/xml/#sec-well-formed">document entity</a>. The
string returned must be XML namespace-well-formed and must be an
isomorphic serialization of all of that node's child nodes, in document
order. User agents may adjust prefixes and namespace declarations in the
serialization (and indeed might be forced to do so in some cases to obtain
namespace-well-formed XML). For the <code
title=dom-innerHTML-XML>innerHTML</code> attribute on <code><a
href="#htmlelement">HTMLElement</a></code> objects, if any of the elements
in the serialization are in no namespace, the default namespace in scope
for those elements must be explicitly declared as the empty
string.<!-- because otherwise round-tripping might break
since it'll pick up the surrounding default ns when setting -->
(This doesn't apply to the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> attribute on <code><a
href="#htmldocument">HTMLDocument</a></code> objects.) <a
href="#refsXML">[XML]</a> <a href="#refsXMLNS">[XMLNS]</a>
(This doesn't apply to the <code title=dom-innerHTML-XML>innerHTML</code>
attribute on <code><a href="#htmldocument">HTMLDocument</a></code>
objects.) <a href="#refsXML">[XML]</a> <a href="#refsXMLNS">[XMLNS]</a>

<p>If any of the following cases are found in the DOM being serialized, the
user agent must raise an <code>INVALID_STATE_ERR</code> exception:
Expand Down Expand Up @@ -9134,8 +9177,8 @@ data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ alert('test
attribute with a name that contains an equals sign (=) will raised an
<code>INVALID_CHARACTER_ERR</code> exception.

<p>On setting, in an XML context, the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> DOM attribute on <code><a
<p>On setting, in an XML context, the <code
title=dom-innerHTML-XML>innerHTML</code> DOM attribute on <code><a
href="#htmlelement">HTMLElement</a></code>s and <code><a
href="#htmldocument">HTMLDocument</a></code>s must run the following
algorithm:
Expand All @@ -9145,33 +9188,30 @@ data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ alert('test
<p>The user agent must create a new <span>XML parser</span>.</p>

<li>
<p>If the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> attribute is being set on an
element, the user agent must <span>feed the parser</span> just created
the string corresponding to the start tag of that element, declaring all
the namespace prefixes that are in scope on that element in the DOM, as
well as declaring the default namespace (if any) that is in scope on
that element in the DOM.</p>
<p>If the <code title=dom-innerHTML-XML>innerHTML</code> attribute is
being set on an element, the user agent must <span>feed the
parser</span> just created the string corresponding to the start tag of
that element, declaring all the namespace prefixes that are in scope on
that element in the DOM, as well as declaring the default namespace (if
any) that is in scope on that element in the DOM.</p>

<li>
<p>The user agent must <span>feed the parser</span> just created the
string being assigned into the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> attribute.</p>
string being assigned into the <code
title=dom-innerHTML-XML>innerHTML</code> attribute.</p>

<li>
<p>If the <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> attribute is being set on an
element, the user agent must <span>feed the parser</span> the string
corresponding to the end tag of that element.</p>
<p>If the <code title=dom-innerHTML-XML>innerHTML</code> attribute is
being set on an element, the user agent must <span>feed the
parser</span> the string corresponding to the end tag of that element.</p>

<li>
<p>If the parser found a well-formedness error, the attribute's setter
must raise a <code>SYNTAX_ERR</code> exception and abort these steps.</p>

<li>
<p>The user agent must remove the children nodes of the node whose <code
title=dom-innerHTML-XML><a href="#innerhtml1">innerHTML</a></code>
attribute is being set.</p>
title=dom-innerHTML-XML>innerHTML</code> attribute is being set.</p>

<li>
<p>If the attribute is being set on a <code>Document</code> node, let
Expand All @@ -9193,15 +9233,24 @@ data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ alert('test

<li>
<p>Append all the <var title="">new children</var> nodes to the node
whose <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> attribute is being set,
preserving their order.</p>
whose <code title=dom-innerHTML-XML>innerHTML</code> attribute is being
set, preserving their order.</p>
</ol>

<p class=note><code><a href="#script1">script</a></code> elements inserted
using <code title=dom-innerHTML-XML><a
href="#innerhtml1">innerHTML</a></code> do not execute when they are
inserted.
using <code title=dom-innerHTML-XML>innerHTML</code> do not execute when
they are inserted.

<p>In an XML context, the <dfn id=document.write0
title=dom-document-write-XML><code>document.write()</code></dfn> method,
and the <dfn id=outerhtml1
title=dom-outerHTML-XML><code>outerHTML</code></dfn> attribute on both
getting and setting, must raise an <code>INVALID_ACCESS_ERR</code>
exception.</p>
<!--
Where would document.write() insert?
Consider: data:text/xml,<script xmlns="http://www.w3.org/1999/xhtml"><![CDATA[ document.write('<foo>Test</foo>'); ]]></script>
-->

<h2 id=semantics><span class=secno>4. </span>The elements of HTML</h2>

Expand Down Expand Up @@ -26136,10 +26185,9 @@ function AddCloud(data, x, y) { ... }</pre>
href="#without">without script</a>, or if the <code><a
href="#script1">script</a></code> element was created by an <span>XML
parser</span> that itself was created as part of the processing of the
<code title=dom-innerHTML-XML><a href="#innerhtml1">innerHTML</a></code>
attribute's setter<!--
<code title=dom-innerHTML-XML>innerHTML</code> attribute's setter<!--
no need to worry about the innerHTML-HTML case, as the HTML parser
handles that for us-->,
handles that for us, and outerHTML-XML doesn't work-->,
or if the user agent does not <a href="#support">support the scripting
language</a> given by <var><a href="#the-scripts">the script's
type</a></var> for this <code><a href="#script1">script</a></code>
Expand Down Expand Up @@ -45872,14 +45920,14 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
here for now in case people think that the spec accidentally
omitted it and try to "fix" it. Note that noscript-in-head is also
handled this way. This is all intentional. The only thing it
doesn't handle is the scripting-enabled fragment parsing case for a
<head> element containing a <noscript> which itself contains
doesn't handle is the scripting-disabled fragment parsing case for
a <head> element containing a <noscript> which itself contains
something other than a <link> or a <style> element; you'd expect
that to break out of the <noscript> but it doesn't. This is an edge
case that doesn't affect the spec, since the algorithm for fragment
parsing is only used for innerHTML, where we know scripting is
enabled. (XXX except maybe if innerHTML is set from another
browsing context on a document with designMode set?) -->
parsing is only used for innerHTML/outerHTML, where we know
scripting is enabled. (XXX except maybe if innerHTML is set from
another browsing context on a document with designMode set?) -->

<li>If <var title="">node</var> is a <code><a
href="#body0">body</a></code> element, then switch the <span>insertion
Expand Down Expand Up @@ -49029,7 +49077,9 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
element as "already executed" prevents it from executing when it is
inserted into the document a few paragraphs below. Thus, scripts missing
their end tags and scripts that were inserted using <code
title=dom-innerHTML-HTML><a href="#innerhtml0">innerHTML</a></code>
title=dom-innerHTML-HTML><a
href="#innerhtml0">innerHTML</a></code>/<code
title=dom-outerHTML-HTML><a href="#outerhtml0">outerHTML</a></code>
aren't executed.</p>

<p>Let the <var title="">old insertion point</var> have the same value as
Expand Down Expand Up @@ -51428,7 +51478,9 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
href="#html-fragment0">HTML fragment parsing algorithm</a>, this is a <a
href="#parse2">parse error</a>; ignore the token. (<a
href="#fragment">fragment case</a>)</p>
<!-- can only happen for <html>'s own innerHTML -->
<!-- can only happen for <html>'s own innerHTML or its children's
outerHTML -->

<p>Otherwise, switch the <span>insertion mode</span> to "<a
href="#after12" title="insertion mode: after after body">after after
body</a>".</p>
Expand Down Expand Up @@ -52018,7 +52070,7 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
element, then append the value of <var title="">current node</var>'s
<code title="">data</code> DOM attribute literally.</p>
<!-- note about noscript: we're
assuming here that scripting is disabled. If this algorithm is
assuming here that scripting is enabled. If this algorithm is
used with scripting disabled, this won't work right. XXX This
might affect calling innerHTML on nodes in a document that is
being designMode'd -->
Expand Down

0 comments on commit 3530ce1

Please sign in to comment.