Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[e] (0) Add an example of a script moving nodes the parser is parsing.
git-svn-id: http://svn.whatwg.org/webapps@3411 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
Hixie committed Jul 15, 2009
1 parent 6ba5e6d commit eb34532
Show file tree
Hide file tree
Showing 2 changed files with 126 additions and 2 deletions.
64 changes: 62 additions & 2 deletions index
Expand Up @@ -951,7 +951,8 @@
<ol>
<li><a href=#misnested-tags:-b-i-/b-/i><span class=secno>9.2.8.1 </span>Misnested tags: &lt;b&gt;&lt;i&gt;&lt;/b&gt;&lt;/i&gt;</a></li>
<li><a href=#misnested-tags:-b-p-/b-/p><span class=secno>9.2.8.2 </span>Misnested tags: &lt;b&gt;&lt;p&gt;&lt;/b&gt;&lt;/p&gt;</a></li>
<li><a href=#unexpected-markup-in-tables><span class=secno>9.2.8.3 </span>Unexpected markup in tables</a></ol></ol></li>
<li><a href=#unexpected-markup-in-tables><span class=secno>9.2.8.3 </span>Unexpected markup in tables</a></li>
<li><a href=#scripts-that-modify-the-page-as-it-is-being-parsed><span class=secno>9.2.8.4 </span>Scripts that modify the page as it is being parsed</a></ol></ol></li>
<li><a href=#namespaces><span class=secno>9.3 </span>Namespaces</a></li>
<li><a href=#serializing-html-fragments><span class=secno>9.4 </span>Serializing HTML fragments</a></li>
<li><a href=#parsing-html-fragments><span class=secno>9.5 </span>Parsing HTML fragments</a></li>
Expand Down Expand Up @@ -65082,7 +65083,66 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
result in yet another <code><a href=#the-b-element>b</a></code> element being created, this
time after the table:</p>

<ul class=domTree><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><li class=t1><code><a href=#the-body-element>body</a></code><ul><li class=t1><code><a href=#the-b-element>b</a></code><li class=t1><code><a href=#the-b-element>b</a></code><ul><li class=t3><code>#text</code>: <span title="">bbb</span></ul><li class=t1><code><a href=#the-table-element>table</a></code><ul><li class=t1><code><a href=#the-tbody-element>tbody</a></code><ul><li class=t1><code><a href=#the-tr-element>tr</a></code><ul><li class=t1><code><a href=#the-td-element>td</a></code><ul><li class=t3><code>#text</code>: <span title="">aaa</span></ul></ul></ul></ul><li class=t1><code><a href=#the-b-element>b</a></code><ul><li class=t3><code>#text</code>: <span title="">ccc</span></ul></ul></ul></ul><h3 id=namespaces><span class=secno>9.3 </span>Namespaces</h3>
<ul class=domTree><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><li class=t1><code><a href=#the-body-element>body</a></code><ul><li class=t1><code><a href=#the-b-element>b</a></code><li class=t1><code><a href=#the-b-element>b</a></code><ul><li class=t3><code>#text</code>: <span title="">bbb</span></ul><li class=t1><code><a href=#the-table-element>table</a></code><ul><li class=t1><code><a href=#the-tbody-element>tbody</a></code><ul><li class=t1><code><a href=#the-tr-element>tr</a></code><ul><li class=t1><code><a href=#the-td-element>td</a></code><ul><li class=t3><code>#text</code>: <span title="">aaa</span></ul></ul></ul></ul><li class=t1><code><a href=#the-b-element>b</a></code><ul><li class=t3><code>#text</code>: <span title="">ccc</span></ul></ul></ul></ul><h5 id=scripts-that-modify-the-page-as-it-is-being-parsed><span class=secno>9.2.8.4 </span>Scripts that modify the page as it is being parsed</h5>

<p><i>This section is non-normative.</i></p>

<p>Consider the following markup, which for this example we will
assume is the document with <a href=#url>URL</a> <code title="">http://example.com/inner</code>, being rendered as the
content of an <code><a href=#the-iframe-element>iframe</a></code> in another document with the
<a href=#url>URL</a> <code title="">http://example.com/outer</code>:</p>

<pre>&lt;div id=a&gt;
&lt;script&gt;
var div = document.getElementById('a');
parent.document.body.appendChild(div);
&lt;/script&gt;
&lt;script&gt;
alert(document.URL);
&lt;/script&gt;
&lt;/div&gt;
&lt;script&gt;
alert(document.URL);
&lt;/script&gt;</pre>

<p>Up to the first "script" end tag, before the script is parsed,
the result is relatively straightforward:</p>

<ul class=domTree><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><li class=t1><code><a href=#the-body-element>body</a></code><ul><li class=t1><code><a href=#the-div-element>div</a></code> <span class=t2><code class="attribute name">id</code>="<code class="attribute value"><a href=#the-a-element>a</a></code>"</span><ul><li class=t3><code>#text</code>: <span title="">
</span><li class=t1><code><a href=#script>script</a></code><ul><li class=t3><code>#text</code>: <pre> var div = document.getElementById('a');
parent.document.body.appendChild(div);</pre></ul></ul></ul></ul></ul><p>After the script is parsed, though, the <code><a href=#the-div-element>div</a></code> element
and its child <code><a href=#script>script</a></code> element are gone:</p>

<ul class=domTree><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><li class=t1><code><a href=#the-body-element>body</a></code></ul></ul><p>They are, at this point, in the <code>Document</code> of the
aforementioned outer <a href=#browsing-context>browsing context</a>. However, the
<a href=#stack-of-open-elements>stack of open elements</a> <em>still contains the
<code><a href=#the-div-element>div</a></code> element</em>.</p>

<p>Thus, when the second <code><a href=#script>script</a></code> element is parsed, it
is inserted <em>into the outer <code>Document</code>
object</em>.</p>

<p>This also means that the <a href="#script's-global-object">script's global object</a> is
the outer <a href=#browsing-context>browsing context</a>'s <code><a href=#window>Window</a></code>
object, <em>not</em> the <code><a href=#window>Window</a></code> object inside the
<code><a href=#the-iframe-element>iframe</a></code>.</p>

<p class=note>This isn't a security problem since the script that
moves the <code><a href=#the-div-element>div</a></code> into the outer <code>Document</code> can
only do so because they have the two <code>Document</code> object
have the same <a href=#origin-0>origin</a>.</p>

<p>Thus, the first alert says "http://example.com/outer".</p>

<p>Once the <code><a href=#the-div-element>div</a></code> element's end tag is parsed, the
<code><a href=#the-div-element>div</a></code> element is popped off the stack, and so the next
<code><a href=#script>script</a></code> element is in the inner <code>Document</code>:</p>

<ul class=domTree><li class=t1><code><a href=#the-html-element>html</a></code><ul><li class=t1><code><a href=#the-head-element>head</a></code><li class=t1><code><a href=#the-body-element>body</a></code><ul><li class=t1><code><a href=#script>script</a></code><ul><li class=t3><code>#text</code>: <span title="">alert(document.URL);</span></ul></ul></ul></ul><p>This second alert will say "http://example.com/inner".</p>



<h3 id=namespaces><span class=secno>9.3 </span>Namespaces</h3>

<p>The <dfn id=html-namespace-0>HTML namespace</dfn> is: <code>http://www.w3.org/1999/xhtml</code></p>

Expand Down
64 changes: 64 additions & 0 deletions source
Expand Up @@ -79365,6 +79365,70 @@ http://lxr.mozilla.org/seamonkey/search?string=nested
<ul class="domTree"><li class="t1"><code>html</code><ul><li class="t1"><code>head</code></li><li class="t1"><code>body</code><ul><li class="t1"><code>b</code></li><li class="t1"><code>b</code><ul><li class="t3"><code>#text</code>: <span title="">bbb</span></li></ul></li><li class="t1"><code>table</code><ul><li class="t1"><code>tbody</code><ul><li class="t1"><code>tr</code><ul><li class="t1"><code>td</code><ul><li class="t3"><code>#text</code>: <span title="">aaa</span></li></ul></li></ul></li></ul></li></ul></li><li class="t1"><code>b</code><ul><li class="t3"><code>#text</code>: <span title="">ccc</span></li></ul></li></ul></li></ul></li></ul>


<h5>Scripts that modify the page as it is being parsed</h5>

<p><i>This section is non-normative.</i></p>

<p>Consider the following markup, which for this example we will
assume is the document with <span>URL</span> <code
title="">http://example.com/inner</code>, being rendered as the
content of an <code>iframe</code> in another document with the
<span>URL</span> <code title="">http://example.com/outer</code>:</p>

<pre>&lt;div id=a>
&lt;script>
var div = document.getElementById('a');
parent.document.body.appendChild(div);
&lt;/script>
&lt;script>
alert(document.URL);
&lt;/script>
&lt;/div>
&lt;script>
alert(document.URL);
&lt;/script></pre>

<p>Up to the first "script" end tag, before the script is parsed,
the result is relatively straightforward:</p>

<ul class="domTree"><li class="t1"><code>html</code><ul><li class="t1"><code>head</code></li><li class="t1"><code>body</code><ul><li class="t1"><code>div</code> <span class="t2"><code class="attribute name">id</code>="<code class="attribute value">a</code>"</span><ul><li class="t3"><code>#text</code>: <span title="">
</span></li><li class="t1"><code>script</code><ul><li class="t3"><code>#text</code>: <pre> var div = document.getElementById('a');
parent.document.body.appendChild(div);</pre></li></ul></li></ul></li></ul></li></ul></li></ul>

<p>After the script is parsed, though, the <code>div</code> element
and its child <code>script</code> element are gone:</p>

<ul class="domTree"><li class="t1"><code>html</code><ul><li class="t1"><code>head</code></li><li class="t1"><code>body</code></li></ul></li></ul>

<p>They are, at this point, in the <code>Document</code> of the
aforementioned outer <span>browsing context</span>. However, the
<span>stack of open elements</span> <em>still contains the
<code>div</code> element</em>.</p>

<p>Thus, when the second <code>script</code> element is parsed, it
is inserted <em>into the outer <code>Document</code>
object</em>.</p>

<p>This also means that the <span>script's global object</span> is
the outer <span>browsing context</span>'s <code>Window</code>
object, <em>not</em> the <code>Window</code> object inside the
<code>iframe</code>.</p>

<p class="note">This isn't a security problem since the script that
moves the <code>div</code> into the outer <code>Document</code> can
only do so because they have the two <code>Document</code> object
have the same <span>origin</span>.</p>

<p>Thus, the first alert says "http://example.com/outer".</p>

<p>Once the <code>div</code> element's end tag is parsed, the
<code>div</code> element is popped off the stack, and so the next
<code>script</code> element is in the inner <code>Document</code>:</p>

<ul class="domTree"><li class="t1"><code>html</code><ul><li class="t1"><code>head</code></li><li class="t1"><code>body</code><ul><li class="t1"><code>script</code><ul><li class="t3"><code>#text</code>: <span title="">alert(document.URL);</span></li></ul></li></ul></li></ul></li></ul>

<p>This second alert will say "http://example.com/inner".</p>



<h3>Namespaces</h3>
Expand Down

0 comments on commit eb34532

Please sign in to comment.