apis-in-html-documents.html 68.8 KB

Raw Blame History Permalink

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en-US-x-Hixie" ><head><title>3.3 APIs in HTML documents &#8212; HTML5 </title><style type="text/css">
   pre { margin-left: 2em; white-space: pre-wrap; }
   h2 { margin: 3em 0 1em 0; }
   h3 { margin: 2.5em 0 1em 0; }
   h4 { margin: 2.5em 0 0.75em 0; }
   h5, h6 { margin: 2.5em 0 1em; }
   h1 + h2, h1 + h2 + h2 { margin: 0.75em 0 0.75em; }
   h2 + h3, h3 + h4, h4 + h5, h5 + h6 { margin-top: 0.5em; }
   p { margin: 1em 0; }
   hr:not(.top) { display: block; background: none; border: none; padding: 0; margin: 2em 0; height: auto; }
   dl, dd { margin-top: 0; margin-bottom: 0; }
   dt { margin-top: 0.75em; margin-bottom: 0.25em; clear: left; }
   dt + dt { margin-top: 0; }
   dd dt { margin-top: 0.25em; margin-bottom: 0; }
   dd p { margin-top: 0; }
   dd dl + p { margin-top: 1em; }
   dd table + p { margin-top: 1em; }
   p + * > li, dd li { margin: 1em 0; }
   dt, dfn { font-weight: bold; font-style: normal; }
   dt dfn { font-style: italic; }
   pre, code { font-size: inherit; font-family: monospace; font-variant: normal; }
   pre strong { color: black; font: inherit; font-weight: bold; background: yellow; }
   pre em { font-weight: bolder; font-style: normal; }
   @media screen { code { color: orangered; } code :link, code :visited { color: inherit; } }
   var sub { vertical-align: bottom; font-size: smaller; position: relative; top: 0.1em; }
   table { border-collapse: collapse; border-style: hidden hidden none hidden; }
   table thead, table tbody { border-bottom: solid; }
   table tbody th:first-child { border-left: solid; }
   table tbody th { text-align: left; }
   table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
   blockquote { margin: 0 0 0 2em; border: 0; padding: 0; font-style: italic; }

   .bad, .bad *:not(.XXX) { color: gray; border-color: gray; background: transparent; }
   .matrix, .matrix td { border: none; text-align: right; }
   .matrix { margin-left: 2em; }
   .dice-example { border-collapse: collapse; border-style: hidden solid solid hidden; border-width: thin; margin-left: 3em; }
   .dice-example caption { width: 30em; font-size: smaller; font-style: italic; padding: 0.75em 0; text-align: left; }
   .dice-example td, .dice-example th { border: solid thin; width: 1.35em; height: 1.05em; text-align: center; padding: 0; }

   .toc dfn, h1 dfn, h2 dfn, h3 dfn, h4 dfn, h5 dfn, h6 dfn { font: inherit; }
   img.extra { float: right; }
   pre.idl { border: solid thin; background: #EEEEEE; color: black; padding: 0.5em 1em; }
   pre.idl :link, pre.idl :visited { color: inherit; background: transparent; }
   pre.css { border: solid thin; background: #FFFFEE; color: black; padding: 0.5em 1em; }
   pre.css:first-line { color: #AAAA50; }
   dl.domintro { color: green; margin: 2em 0 2em 2em; padding: 0.5em 1em; border: none; background: #DDFFDD; }
   hr + dl.domintro, div.impl + dl.domintro { margin-top: 2.5em; margin-bottom: 1.5em; }
   dl.domintro dt, dl.domintro dt * { color: black; text-decoration: none; }
   dl.domintro dd { margin: 0.5em 0 1em 2em; padding: 0; }
   dl.domintro dd p { margin: 0.5em 0; }
   dl.switch { padding-left: 2em; }
   dl.switch > dt { text-indent: -1.5em; }
   dl.switch > dt:before { content: '\21AA'; padding: 0 0.5em 0 0; display: inline-block; width: 1em; text-align: right; line-height: 0.5em; }
   dl.triple { padding: 0 0 0 1em; }
   dl.triple dt, dl.triple dd { margin: 0; display: inline }
   dl.triple dt:after { content: ':'; }
   dl.triple dd:after { content: '\A'; white-space: pre; }
   .diff-old { text-decoration: line-through; color: silver; background: transparent; }
   .diff-chg, .diff-new { text-decoration: underline; color: green; background: transparent; }
   a .diff-new { border-bottom: 1px blue solid; }

   h2 { page-break-before: always; }
   h1, h2, h3, h4, h5, h6 { page-break-after: avoid; }
   h1 + h2, hr + h2.no-toc { page-break-before: auto; }

   p  > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]),
   li > span:not([title=""]):not([class="XXX"]):not([class="impl"]):not([class="note"]), { border-bottom: solid #9999CC; }

   div.head { margin: 0 0 1em; padding: 1em 0 0 0; }
   div.head p { margin: 0; }
   div.head h1 { margin: 0; }
   div.head .logo { float: right; margin: 0 1em; }
   div.head .logo img { border: none } /* remove border from top image */
   div.head dl { margin: 1em 0; }
   div.head p.copyright, div.head p.alt { font-size: x-small; font-style: oblique; margin: 0; }

   body > .toc > li { margin-top: 1em; margin-bottom: 1em; }
   body > .toc.brief > li { margin-top: 0.35em; margin-bottom: 0.35em; }
   body > .toc > li > * { margin-bottom: 0.5em; }
   body > .toc > li > * > li > * { margin-bottom: 0.25em; }
   .toc, .toc li { list-style: none; }

   .brief { margin-top: 1em; margin-bottom: 1em; line-height: 1.1; }
   .brief li { margin: 0; padding: 0; }
   .brief li p { margin: 0; padding: 0; }

   .category-list { margin-top: -0.75em; margin-bottom: 1em; line-height: 1.5; }
   .category-list::before { content: '\21D2\A0'; font-size: 1.2em; font-weight: 900; }
   .category-list li { display: inline; }
   .category-list li:not(:last-child)::after { content: ', '; }
   .category-list li > span, .category-list li > a { text-transform: lowercase; }
   .category-list li * { text-transform: none; } /* don't affect <code> nested in <a> */

   .XXX { color: #E50000; background: white; border: solid red; padding: 0.5em; margin: 1em 0; }
   .XXX > :first-child { margin-top: 0; }
   p .XXX { line-height: 3em; }
   .annotation { border: solid thin black; background: #0C479D; color: white; position: relative; margin: 8px 0 20px 0; }
   .annotation:before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 6px -6px -6px 6px; background: #333333; z-index: -1; content: ''; }
   .annotation :link, .annotation :visited { color: inherit; }
   .annotation :link:hover, .annotation :visited:hover { background: transparent; }
   .annotation span { border: none ! important; }
   .note { color: green; background: transparent; font-family: sans-serif; }
   .warning { color: red; background: transparent; }
   .note, .warning { font-weight: bolder; font-style: italic; }
   p.note, div.note { padding: 0.5em 2em; }
   span.note { padding: 0 2em; }
   .note p:first-child, .warning p:first-child { margin-top: 0; }
   .note p:last-child, .warning p:last-child { margin-bottom: 0; }
   .warning:before { font-style: normal; }
   p.note:before { content: 'Note: '; }
   p.warning:before { content: '\26A0 Warning! '; }

   .bookkeeping:before { display: block; content: 'Bookkeeping details'; font-weight: bolder; font-style: italic; }
   .bookkeeping { font-size: 0.8em; margin: 2em 0; }
   .bookkeeping p { margin: 0.5em 2em; display: list-item; list-style: square; }
   .bookkeeping dt { margin: 0.5em 2em 0; }
   .bookkeeping dd { margin: 0 3em 0.5em; }

   h4 { position: relative; z-index: 3; }
   h4 + .element, h4 + div + .element { margin-top: -2.5em; padding-top: 2em; }
   .element {
     background: #EEEEFF;
     color: black;
     margin: 0 0 1em 0.15em;
     padding: 0 1em 0.25em 0.75em;
     border-left: solid #9999FF 0.25em;
     position: relative;
     z-index: 1;
   }
   .element:before {
     position: absolute;
     z-index: 2;
     top: 0;
     left: -1.15em;
     height: 2em;
     width: 0.9em;
     background: #EEEEFF;
     content: ' ';
     border-style: none none solid solid;
     border-color: #9999FF;
     border-width: 0.25em;
   }

   .example { display: block; color: #222222; background: #FCFCFC; border-left: double; margin-left: 2em; padding-left: 1em; }
   td > .example:only-child { margin: 0 0 0 0.1em; }

   ul.domTree, ul.domTree ul { padding: 0 0 0 1em; margin: 0; }
   ul.domTree li { padding: 0; margin: 0; list-style: none; position: relative; }
   ul.domTree li li { list-style: none; }
   ul.domTree li:first-child::before { position: absolute; top: 0; height: 0.6em; left: -0.75em; width: 0.5em; border-style: none none solid solid; content: ''; border-width: 0.1em; }
   ul.domTree li:not(:last-child)::after { position: absolute; top: 0; bottom: -0.6em; left: -0.75em; width: 0.5em; border-style: none none solid solid; content: ''; border-width: 0.1em; }
   ul.domTree span { font-style: italic; font-family: serif; }
   ul.domTree .t1 code { color: purple; font-weight: bold; }
   ul.domTree .t2 { font-style: normal; font-family: monospace; }
   ul.domTree .t2 .name { color: black; font-weight: bold; }
   ul.domTree .t2 .value { color: blue; font-weight: normal; }
   ul.domTree .t3 code, .domTree .t4 code, .domTree .t5 code { color: gray; }
   ul.domTree .t7 code, .domTree .t8 code { color: green; }
   ul.domTree .t10 code { color: teal; }

   body.dfnEnabled dfn { cursor: pointer; }
   .dfnPanel {
     display: inline;
     position: absolute;
     z-index: 10;
     height: auto;
     width: auto;
     padding: 0.5em 0.75em;
     font: small sans-serif, Droid Sans Fallback;
     background: #DDDDDD;
     color: black;
     border: outset 0.2em;
   }
   .dfnPanel * { margin: 0; padding: 0; font: inherit; text-indent: 0; }
   .dfnPanel :link, .dfnPanel :visited { color: black; }
   .dfnPanel p { font-weight: bolder; }
   .dfnPanel * + p { margin-top: 0.25em; }
   .dfnPanel li { list-style-position: inside; }

   #configUI { position: absolute; z-index: 20; top: 10em; right: 1em; width: 11em; font-size: small; }
   #configUI p { margin: 0.5em 0; padding: 0.3em; background: #EEEEEE; color: black; border: inset thin; }
   #configUI p label { display: block; }
   #configUI #updateUI, #configUI .loginUI { text-align: center; }
   #configUI input[type=button] { display: block; margin: auto; }

   fieldset { margin: 1em; padding: 0.5em 1em; }
   fieldset > legend + * { margin-top: 0; }
   fieldset > :last-child { margin-bottom: 0; }
   fieldset p { margin: 0.5em 0; }

   .stability {
     position: fixed;
     bottom: 0;
     left: 0; right: 0;
     margin: 0 auto 0 auto !important;
    z-index: 1000;
     width: 50%;
     background: maroon; color: yellow;
     -webkit-border-radius: 1em 1em 0 0;
     -moz-border-radius: 1em 1em 0 0;
     border-radius: 1em 1em 0 0;
     -moz-box-shadow: 0 0 1em #500;
     -webkit-box-shadow: 0 0 1em #500;
     box-shadow: 0 0 1em red;
     padding: 0.5em 1em;
     text-align: center;
   }
   .stability strong {
     display: block;
   }
   .stability input {
     appearance: none; margin: 0; border: 0; padding: 0.25em 0.5em; background: transparent; color: black;
     position: absolute; top: -0.5em; right: 0; font: 1.25em sans-serif; text-align: center;
   }
   .stability input:hover {
     color: white;
     text-shadow: 0 0 2px black;
   }
   .stability input:active {
     padding: 0.3em 0.45em 0.2em 0.55em;
   }
   .stability :link, .stability :visited,
   .stability :link:hover, .stability :visited:hover {
     background: transparent;
     color: white;
   }

  </style><link href="data:text/css,.impl%20%7B%20display:%20none;%20%7D%0Ahtml%20%7B%20border:%20solid%20yellow;%20%7D%20.domintro:before%20%7B%20display:%20none;%20%7D" id="author" rel="alternate stylesheet" title="Author documentation only"><link href="data:text/css,.impl%20%7B%20background:%20%23FFEEEE;%20%7D%20.domintro:before%20%7B%20background:%20%23FFEEEE;%20%7D" id="highlight" rel="alternate stylesheet" title="Highlight implementation
requirements"><link href="http://www.w3.org/StyleSheets/TR/W3C-WD" rel="stylesheet" type="text/css"><style type="text/css">

   .applies thead th > * { display: block; }
   .applies thead code { display: block; }
   .applies tbody th { whitespace: nowrap; }
   .applies td { text-align: center; }
   .applies .yes { background: yellow; }

   .matrix, .matrix td { border: hidden; text-align: right; }
   .matrix { margin-left: 2em; }

   .dice-example { border-collapse: collapse; border-style: hidden solid solid hidden; border-width: thin; margin-left: 3em; }
   .dice-example caption { width: 30em; font-size: smaller; font-style: italic; padding: 0.75em 0; text-align: left; }
   .dice-example td, .dice-example th { border: solid thin; width: 1.35em; height: 1.05em; text-align: center; padding: 0; }

   td.eg { border-width: thin; text-align: center; }

   #table-example-1 { border: solid thin; border-collapse: collapse; margin-left: 3em; }
   #table-example-1 * { font-family: "Essays1743", serif; line-height: 1.01em; }
   #table-example-1 caption { padding-bottom: 0.5em; }
   #table-example-1 thead, #table-example-1 tbody { border: none; }
   #table-example-1 th, #table-example-1 td { border: solid thin; }
   #table-example-1 th { font-weight: normal; }
   #table-example-1 td { border-style: none solid; vertical-align: top; }
   #table-example-1 th { padding: 0.5em; vertical-align: middle; text-align: center; }
   #table-example-1 tbody tr:first-child td { padding-top: 0.5em; }
   #table-example-1 tbody tr:last-child td { padding-bottom: 1.5em; }
   #table-example-1 tbody td:first-child { padding-left: 2.5em; padding-right: 0; width: 9em; }
   #table-example-1 tbody td:first-child::after { content: leader(". "); }
   #table-example-1 tbody td { padding-left: 2em; padding-right: 2em; }
   #table-example-1 tbody td:first-child + td { width: 10em; }
   #table-example-1 tbody td:first-child + td ~ td { width: 2.5em; }
   #table-example-1 tbody td:first-child + td + td + td ~ td { width: 1.25em; }

   .apple-table-examples { border: none; border-collapse: separate; border-spacing: 1.5em 0em; width: 40em; margin-left: 3em; }
   .apple-table-examples * { font-family: "Times", serif; }
   .apple-table-examples td, .apple-table-examples th { border: none; white-space: nowrap; padding-top: 0; padding-bottom: 0; }
   .apple-table-examples tbody th:first-child { border-left: none; width: 100%; }
   .apple-table-examples thead th:first-child ~ th { font-size: smaller; font-weight: bolder; border-bottom: solid 2px; text-align: center; }
   .apple-table-examples tbody th::after, .apple-table-examples tfoot th::after { content: leader(". ") }
   .apple-table-examples tbody th, .apple-table-examples tfoot th { font: inherit; text-align: left; }
   .apple-table-examples td { text-align: right; vertical-align: top; }
   .apple-table-examples.e1 tbody tr:last-child td { border-bottom: solid 1px; }
   .apple-table-examples.e1 tbody + tbody tr:last-child td { border-bottom: double 3px; }
   .apple-table-examples.e2 th[scope=row] { padding-left: 1em; }
   .apple-table-examples sup { line-height: 0; }

   .details-example img { vertical-align: top; }

   #base64-table {
     white-space: nowrap;
     font-size: 0.6em;
     column-width: 6em;
     column-count: 5;
     column-gap: 1em;
     -moz-column-width: 6em;
     -moz-column-count: 5;
     -moz-column-gap: 1em;
     -webkit-column-width: 6em;
     -webkit-column-count: 5;
     -webkit-column-gap: 1em;
   }
   #base64-table thead { display: none; }
   #base64-table * { border: none; }
   #base64-table tbody td:first-child:after { content: ':'; }
   #base64-table tbody td:last-child { text-align: right; }

   #named-character-references-table {
     white-space: nowrap;
     font-size: 0.6em;
     column-width: 30em;
     column-gap: 1em;
     -moz-column-width: 30em;
     -moz-column-gap: 1em;
     -webkit-column-width: 30em;
     -webkit-column-gap: 1em;
   }
   #named-character-references-table > table > tbody > tr > td:first-child + td,
   #named-character-references-table > table > tbody > tr > td:last-child { text-align: center; }
   #named-character-references-table > table > tbody > tr > td:last-child:hover > span { position: absolute; top: auto; left: auto; margin-left: 0.5em; line-height: 1.2; font-size: 5em; border: outset; padding: 0.25em 0.5em; background: white; width: 1.25em; height: auto; text-align: center; }
   #named-character-references-table > table > tbody > tr#entity-CounterClockwiseContourIntegral > td:first-child { font-size: 0.5em; }

   .glyph.control { color: red; }

   @font-face {
     font-family: 'Essays1743';
     src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743.ttf');
   }
   @font-face {
     font-family: 'Essays1743';
     font-weight: bold;
     src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Bold.ttf');
   }
   @font-face {
     font-family: 'Essays1743';
     font-style: italic;
     src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-Italic.ttf');
   }
   @font-face {
     font-family: 'Essays1743';
     font-style: italic;
     font-weight: bold;
     src: url('http://www.whatwg.org/specs/web-apps/current-work/fonts/Essays1743-BoldItalic.ttf');
   }

  </style><style type="text/css">
   .domintro:before { display: table; margin: -1em -0.5em -0.5em auto; width: auto; content: 'This box is non-normative. Implementation requirements are given below this box.'; color: black; font-style: italic; border: solid 2px; background: white; padding: 0 0.25em; }
  </style><script type="text/javascript">
   function getCookie(name) {
     var params = location.search.substr(1).split("&");
     for (var index = 0; index < params.length; index++) {
       if (params[index] == name)
         return "1";
       var data = params[index].split("=");
       if (data[0] == name)
         return unescape(data[1]);
     }
     var cookies = document.cookie.split("; ");
     for (var index = 0; index < cookies.length; index++) {
       var data = cookies[index].split("=");
       if (data[0] == name)
         return unescape(data[1]);
     }
     return null;
   }
  </script>
  <script src="link-fixup.js" type="text/javascript"></script>
  <link href="style.css" rel="stylesheet"><link href="content-models.html" title="3.2.5 Content models" rel="prev">
  <link href="spec.html#contents" title="Table of contents" rel="index">
  <link href="semantics.html" title="4 The elements of HTML" rel="next">
  </head><body><div class="head" id="head">
<div id="multipage-common">
  <p class="stability" id="wip"><strong>This is a work in
  progress!</strong> For the latest updates from the HTML WG, possibly
  including important bug fixes, please look at the <a href="http://dev.w3.org/html5/spec/Overview.html">editor's draft</a> instead.
  There may also be a more
  <a href="http://www.w3.org/TR/html5">up-to-date Working Draft</a>
   with changes based on resolution of Last Call issues.
  <input onclick="closeWarning(this.parentNode)" type="button" value="&#9587;&#8413;"></p>
  <script type="text/javascript">
   function closeWarning(element) {
     element.parentNode.removeChild(element);
     var date = new Date();
     date.setDate(date.getDate()+4);
     document.cookie = 'hide-obsolescence-warning=1; expires=' + date.toGMTString();
   }
   if (getCookie('hide-obsolescence-warning') == '1')
     setTimeout(function () { document.getElementById('wip').parentNode.removeChild(document.getElementById('wip')); }, 2000);
  </script></div>

   <p><a href="http://www.w3.org/"><img alt="W3C" height="48" src="http://www.w3.org/Icons/w3c_home" width="72"></a></p>

   <h1>HTML5</h1>
   </div><div>
   <a href="content-models.html" class="prev">3.2.5 Content models</a> &#8211;
   <a href="spec.html#contents">Table of contents</a> &#8211;
   <a href="semantics.html" class="next">4 The elements of HTML</a>
  <ol class="toc"><li><ol><li><a href="apis-in-html-documents.html#apis-in-html-documents"><span class="secno">3.3 </span>APIs in HTML documents</a></li><li><a href="apis-in-html-documents.html#interactions-with-xpath-and-xslt"><span class="secno">3.4 </span>Interactions with XPath and XSLT</a></li><li><a href="apis-in-html-documents.html#dynamic-markup-insertion"><span class="secno">3.5 </span>Dynamic markup insertion</a>
    <ol><li><a href="apis-in-html-documents.html#opening-the-input-stream"><span class="secno">3.5.1 </span>Opening the input stream</a></li><li><a href="apis-in-html-documents.html#closing-the-input-stream"><span class="secno">3.5.2 </span>Closing the input stream</a></li><li><a href="apis-in-html-documents.html#document.write"><span class="secno">3.5.3 </span><code title="dom-document-write">document.write()</code></a></li><li><a href="apis-in-html-documents.html#document.writeln"><span class="secno">3.5.4 </span><code title="dom-document-writeln">document.writeln()</code></a></li><li><a href="apis-in-html-documents.html#innerhtml"><span class="secno">3.5.5 </span><code title="dom-innerHTML">innerHTML</code></a></li><li><a href="apis-in-html-documents.html#outerhtml"><span class="secno">3.5.6 </span><code title="dom-outerHTML">outerHTML</code></a></li><li><a href="apis-in-html-documents.html#insertadjacenthtml"><span class="secno">3.5.7 </span><code title="dom-insertAdjacentHTML">insertAdjacentHTML()</code></a></li></ol></li></ol></li></ol></div>

  <h3 id="apis-in-html-documents"><span class="secno">3.3 </span>APIs in HTML documents</h3><p>For <a href="dom.html#html-documents">HTML documents</a>, and for <a href="infrastructure.html#html-elements">HTML
  elements</a> in <a href="dom.html#html-documents">HTML documents</a>, certain APIs defined
  in DOM Core become case-insensitive or case-changing, as sometimes
  defined in DOM Core, and as summarized <span class="impl">or
  required</span> below. <a href="references.html#refsDOMCORE">[DOMCORE]</a></p><p>This does not apply to <a href="dom.html#xml-documents">XML documents</a> or to elements
  that are not in the <a href="namespaces.html#html-namespace-0">HTML namespace</a> despite being in
  <a href="dom.html#html-documents">HTML documents</a>.</p><dl><dt><code title="dom-Element-tagName"><a href="infrastructure.html#dom-element-tagname">Element.tagName</a></code> and <code title="dom-Node-nodeName">Node.nodeName</code></dt>

   <dd>

    <p>These attributes <span class="impl">must</span> return element
    names <a href="infrastructure.html#converted-to-ascii-uppercase">converted to ASCII uppercase</a>, regardless of the case
    with which they were created.</p>

   </dd>


   <dt><code title="dom-Document-createElement"><a href="infrastructure.html#dom-document-createelement">Document.createElement()</a></code></dt>

   <dd>

    <p>The canonical form of HTML markup is all-lowercase; thus, this
    method will <a href="infrastructure.html#converted-to-ascii-lowercase" title="converted to ASCII lowercase">lowercase</a>
    the argument before creating the requisite element. <span class="impl">Also, the element created must be in the <a href="namespaces.html#html-namespace-0">HTML
    namespace</a></span>.</p>

    <p class="note">This doesn't apply to <code title="dom-Document-createElementNS"><a href="infrastructure.html#dom-document-createelementns">Document.createElementNS()</a></code>.
    Thus, it is possible, by passing this last method a tag name in
    the wrong case, to create an element that appears to have the same
    tag name as that of an element defined in this specification when
    its <code title="dom-Element-tagName"><a href="infrastructure.html#dom-element-tagname">tagName</a></code> attribute is
    examined, but that doesn't support the corresponding interfaces.
    The "real" element name (unaffected by case conversions) can be
    obtained from the <code title="dom-Node-localName"><a href="infrastructure.html#dom-node-localname">localName</a></code> attribute.</p>

   </dd>


   <dt><code title="dom-Element-setAttribute">Element.setAttribute()</code></dt>
   <dt><code title="dom-Element-setAttributeNode">Element.setAttributeNode()</code></dt>

   <dd>

    <p>Attribute names are <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a>.</p>

    <div class="impl">

     <p>Specifically: when an attribute is set on an <a href="infrastructure.html#html-elements" title="HTML
     elements">HTML element</a> using <code title="">Element.setAttribute()</code>, the name argument must be
     <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a> before the element is
     affected; and when an <code><a href="infrastructure.html#attr">Attr</a></code> node is set on an <a href="infrastructure.html#html-elements" title="HTML elements">HTML element</a> using <code title="">Element.setAttributeNode()</code>, it must have its name
     <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a> before the element is
     affected.</p>

    </div>

    <p class="note">This doesn't apply to <code title="">Element.setAttributeNS()</code> and <code title="">Element.setAttributeNodeNS()</code>.</p>

   </dd>


   <dt><code title="dom-Element-getAttribute">Element.getAttribute()</code></dt>
   <dt><code title="dom-Element-getAttributeNode">Element.getAttributeNode()</code></dt>

   <dd>

    <p>Attribute names are <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a>.</p>

    <div class="impl">

     <p>Specifically: When the <code title="">Element.getAttribute()</code> method or the <code title="">Element.getAttributeNode()</code> method is invoked on
     an <a href="infrastructure.html#html-elements" title="HTML elements">HTML element</a>, the name
     argument must be <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a> before the
     element's attributes are examined.</p>

    </div>

    <p class="note">This doesn't apply to <code title="">Element.getAttributeNS()</code> and <code title="">Element.getAttributeNodeNS()</code>.</p>

   </dd>


   <dt><code title="dom-Document-getElementsByTagName">Document.getElementsByTagName()</code></dt>
   <dt><code title="dom-Element-getElementsByTagName">Element.getElementsByTagName()</code></dt>

   <dd>

    <p>HTML elements match by lower-casing the argument before
    comparison, elements from other namespaces are treated as in XML
    (case-sensitively).</p>

    <div class="impl">

    <p>Specifically, these methods (but not their namespaced
    counterparts) must compare the given argument in a
    <a href="infrastructure.html#case-sensitive">case-sensitive</a> manner, but when looking at <a href="infrastructure.html#html-elements" title="HTML elements">HTML elements</a>, the argument must
    first be <a href="infrastructure.html#converted-to-ascii-lowercase">converted to ASCII lowercase</a>.</p>

    </div>

    <p class="note">Thus, in an <a href="dom.html#html-documents" title="HTML documents">HTML
    document</a> with nodes in multiple namespaces, these methods
    will effectively be both case-sensitive and case-insensitive at
    the same time.</p>

   </dd>


  </dl><div class="impl">

  <h3 id="interactions-with-xpath-and-xslt"><span class="secno">3.4 </span>Interactions with XPath and XSLT</h3>

  <p id="xpath-1.0-processors">Implementations of XPath 1.0 that
  operate on <a href="dom.html#html-documents">HTML documents</a> parsed or created in the
  manners described in this specification (e.g. as part of the <code title="">document.evaluate()</code> API) must act as if the
  following edit was applied to the XPath 1.0 specification.</p>

  <p>First, remove this paragraph:</p>

  <blockquote cite="http://www.w3.org/TR/1999/REC-xpath-19991116#node-tests">

   <p>A <a href="http://www.w3.org/TR/REC-xml-names#NT-QName">QName</a> in the
   node test is expanded into an <a href="http://www.w3.org/TR/1999/REC-xpath-19991116#dt-expanded-name">expanded-name</a>
   using the namespace declarations from the expression context.  This
   is the same way expansion is done for element type names in start
   and end-tags except that the default namespace declared with <code title="">xmlns</code> is not used: if the <a href="http://www.w3.org/TR/REC-xml-names#NT-QName">QName</a> does
   not have a prefix, then the namespace URI is null (this is the same
   way attribute names are expanded).  It is an error if the <a href="http://www.w3.org/TR/REC-xml-names#NT-QName">QName</a> has a
   prefix for which there is no namespace declaration in the
   expression context.</p>

  </blockquote>

  <p>Then, insert in its place the following:</p>

  <blockquote cite="http://www.w3.org/Bugs/Public/show_bug.cgi?id=7059#c37">

   <p>A QName in the node test is expanded into an expanded-name using
   the namespace declarations from the expression context. If the
   QName has a prefix, then there must be a namespace
   declaration for this prefix in the expression context, and the
   corresponding namespace
   URI is the one that is associated with this prefix.  It is an error
   if the QName has a prefix for which there is no namespace
   declaration in the expression context. </p>

   <p>If the QName has no prefix and the principal node type of the
   axis is element, then the default element namespace is
   used. Otherwise if the QName has no prefix, the namespace URI is
   null. The default element namespace is a member of the context for
   the XPath expression. The value of the default element namespace
   when executing an XPath expression through the DOM3 XPath API is
   determined in the following way:</p>

   <ol><li>If the context node is from an HTML DOM, the default element
    namespace is "http://www.w3.org/1999/xhtml".</li>

    <li>Otherwise, the default element namespace URI is null.</li>

   </ol><p class="note">This is equivalent to adding the default element
   namespace feature of XPath 2.0 to XPath 1.0, and using the HTML
   namespace as the default element namespace for HTML documents. It
   is motivated by the desire to have implementations be compatible
   with legacy HTML content while still supporting the changes that
   this specification introduces to HTML regarding the namespace used
   for HTML elements, and by the desire to use XPath 1.0 rather than
   XPath 2.0.</p>

  </blockquote>

  <p class="note">This change is a <a href="introduction.html#willful-violation">willful violation</a> of
  the XPath 1.0 specification, motivated by desire to have
  implementations be compatible with legacy content while still
  supporting the changes that this specification introduces to HTML
  regarding which namespace is used for HTML elements. <a href="references.html#refsXPATH10">[XPATH10]</a></p>
  <hr><p id="dom-based-xslt-1.0-processors">XSLT 1.0 processors outputting
  to a DOM when the output method is "html" (either explicitly or via
  the defaulting rule in XSLT 1.0) are affected as follows:</p>

  <p>If the transformation program outputs an element in no namespace,
  the processor must, prior to constructing the corresponding DOM
  element node, change the namespace of the element to the <a href="namespaces.html#html-namespace-0">HTML
  namespace</a>, <a href="infrastructure.html#converted-to-ascii-lowercase" title="converted to ASCII
  lowercase">ASCII-lowercase</a> the element's local name, and
  <a href="infrastructure.html#converted-to-ascii-lowercase" title="converted to ASCII lowercase">ASCII-lowercase</a>
  the names of any non-namespaced attributes on the element.</p>

  <p class="note">This requirement is a <a href="introduction.html#willful-violation">willful violation</a>
  of the XSLT 1.0 specification, required because this specification
  changes the namespaces and case-sensitivity rules of HTML in a
  manner that would otherwise be incompatible with DOM-based XSLT
  transformations. (Processors that serialize the output are
  unaffected.) <a href="references.html#refsXSLT10">[XSLT10]</a></p>
  <p class="note">There are also additional comments regarding the
  interaction of XSLT and HTML <a href="scripting-1.html#scriptTagXSLT">in the
  <code>script</code> element section</a>.</p>

  </div><h3 id="dynamic-markup-insertion"><span class="secno">3.5 </span><dfn>Dynamic markup insertion</dfn></h3><p class="note">APIs for dynamically inserting markup into the
  document interact with the parser, and thus their behavior varies
  depending on whether they are used with <a href="dom.html#html-documents">HTML documents</a>
  (and the <a href="parsing.html#html-parser">HTML parser</a>) or XHTML in <a href="dom.html#xml-documents">XML
  documents</a> (and the <a href="the-xhtml-syntax.html#xml-parser">XML parser</a>).</p><h4 id="opening-the-input-stream"><span class="secno">3.5.1 </span>Opening the input stream</h4><p>The <dfn id="dom-document-open" title="dom-document-open"><code>open()</code></dfn>
  method comes in several variants with different numbers of
  arguments.</p><dl class="domintro"><dt><var title="">document</var> = <var title="">document</var> . <code title="dom-document-open"><a href="#dom-document-open">open</a></code>( [ <var title="">type</var> [, <var title="">replace</var> ] ] )</dt>

   <dd>

    <p>Causes the <code><a href="infrastructure.html#document">Document</a></code> to be replaced in-place, as if
    it was a new <code><a href="infrastructure.html#document">Document</a></code> object, but reusing the
    previous object, which is then returned.</p>

    <p>If the <var title="">type</var> argument is omitted or has the
    value "<code><a href="iana.html#text-html">text/html</a></code>", then the resulting
    <code><a href="infrastructure.html#document">Document</a></code> has an HTML parser associated with it, which
    can be given data to parse using <code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code>. Otherwise, all
    content passed to <code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code> will be parsed
    as plain text.</p>

    <p>If the <var title="">replace</var> argument is present and has
    the value "<code title="">replace</code>", the existing entries in
    the session history for the <code><a href="infrastructure.html#document">Document</a></code> object are
    removed.</p>

    <p>The method has no effect if the <code><a href="infrastructure.html#document">Document</a></code> is still
    being parsed.</p>

    <p>Throws an <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception if the
    <code><a href="infrastructure.html#document">Document</a></code> is an <a href="dom.html#xml-documents" title="XML documents">XML
    document</a>.</p>

   </dd>

   <dt><var title="">window</var> = <var title="">document</var> . <code title="dom-document-open"><a href="#dom-document-open">open</a></code>( <var title="">url</var>, <var title="">name</var>, <var title="">features</var> [, <var title="">replace</var> ] )</dt>

   <dd>

    <p>Works like the <code title="dom-open"><a href="browsers.html#dom-open">window.open()</a></code>
    method.</p>

   </dd>

  </dl><div class="impl">

  <p>When called with two or fewer arguments, the method must act as
  follows:</p>

  <ol><li>If the <code><a href="infrastructure.html#document">Document</a></code> object is not flagged as an <a href="dom.html#html-documents" title="HTML documents">HTML document</a>, throw an
   <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these
   steps.</li>

   <li><p>Let <var title="">type</var> be the value of the first
   argument, if there is one, or "<code><a href="iana.html#text-html">text/html</a></code>"
   otherwise.</p></li>

   <li><p>Let <var title="">replace</var> be true if there is a second
   argument and it is an <a href="infrastructure.html#ascii-case-insensitive">ASCII case-insensitive</a> match for
   the value "replace", and false otherwise.</p></li>

   <li>

    <p>If the document has an <a href="dom.html#active-parser">active parser</a> that isn't a
    <a href="#script-created-parser">script-created parser</a>, and the <a href="parsing.html#insertion-point">insertion
    point</a> associated with that parser's <a href="parsing.html#the-input-stream">input
    stream</a> is not undefined (that is, it <em>does</em> point to
    somewhere in the input stream), then the method does
    nothing. Abort these steps and return the <code><a href="infrastructure.html#document">Document</a></code>
    object on which the method was invoked.</p>

    <p class="note">This basically causes <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code> to be ignored
    when it's called in an inline script found during the parsing of
    data sent over the network, while still letting it have an effect
    when called asynchronously or on a document that is itself being
    spoon-fed using these APIs.</p>

   </li>

   <li><p>Release the <a href="webappapis.html#storage-mutex">storage mutex</a>.</p></li>

   <li><p><a href="history.html#prompt-to-unload-a-document" title="prompt to unload a document">Prompt to
   unload</a> the <code><a href="infrastructure.html#document">Document</a></code> object. If the user
   <a href="history.html#refused-to-allow-the-document-to-be-unloaded">refused to allow the document to be unloaded</a>, then
   these steps must be aborted.</p></li>

   <li><p><a href="history.html#unload-a-document" title="unload a document">Unload</a> the
   <code><a href="infrastructure.html#document">Document</a></code> object, with the <var title="">recycle</var>
   parameter set to true.</p></li>

   <li><p><a href="history.html#abort-a-document" title="abort a document">Abort</a> the
   <code><a href="infrastructure.html#document">Document</a></code>.</p></li>

   <li><p>Unregister all event listeners registered on the
   <code><a href="infrastructure.html#document">Document</a></code> node and its descendants.</p>

   </li><li><p>Remove any <a href="webappapis.html#concept-task" title="concept-task">tasks</a>
   associated with the <code><a href="infrastructure.html#document">Document</a></code> in any <a href="webappapis.html#task-source">task
   source</a>.</p></li>
   <li><p>Remove all child nodes of the document, without firing any
   mutation events.</p></li>
   <li><p>Replace the <code><a href="infrastructure.html#document">Document</a></code>'s singleton objects with
   new instances of those objects. (This includes in particular the
   <code><a href="browsers.html#window">Window</a></code>, <code><a href="history.html#location">Location</a></code>, <code><a href="history.html#history-0">History</a></code>,
   <code><a href="offline.html#applicationcache">ApplicationCache</a></code>,
   and <code><a href="timers.html#navigator">Navigator</a></code>, objects, the various
   <code><a href="browsers.html#barprop">BarProp</a></code> objects, the two <code>Storage</code> objects,
   the various <code><a href="common-dom-interfaces.html#htmlcollection">HTMLCollection</a></code> objects, and objects
   defined by other specifications, like <code>Selection</code>. It
   also includes all the Web IDL prototypes in the JavaScript binding,
   including the <code><a href="infrastructure.html#document">Document</a></code> object's prototype.)</p></li>


   <li><p>Change the <a href="dom.html#document-s-character-encoding">document's character encoding</a> to
   UTF-8.</p></li>

   <li><p>Set the <code><a href="infrastructure.html#document">Document</a></code> object's <a href="dom.html#reload-override-flag">reload override
   flag</a> and set the <code><a href="infrastructure.html#document">Document</a></code>'s <a href="dom.html#reload-override-buffer">reload
   override buffer</a> to the empty string.</p></li>

   <li><p>Change <a href="dom.html#the-document-s-address">the document's address</a> to the
   <a href="browsers.html#entry-script">entry script</a>'s <a href="webappapis.html#script-s-document" title="script's
   document">document</a>'s <a href="dom.html#the-document-s-address" title="the document's
   address">address</a>.</p></li>

   <li><p>Create a new <a href="parsing.html#html-parser">HTML parser</a> and associate it with
   the document. This is a <dfn id="script-created-parser">script-created parser</dfn> (meaning
   that it can be closed by the <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code> and <code title="dom-document-close"><a href="#dom-document-close">document.close()</a></code> methods, and
   that the tokenizer will wait for an explicit call to <code title="dom-document-close"><a href="#dom-document-close">document.close()</a></code> before emitting
   an end-of-file token). The encoding <a href="parsing.html#concept-encoding-confidence" title="concept-encoding-confidence">confidence</a> is
   <i>irrelevant</i>.</p></li>

   <li><p>Set the <a href="dom.html#current-document-readiness">current document readiness</a> of the
   document to "loading".</p></li>

   <li>


    <p>If the <var title="">type</var> string contains a U+003B
    SEMICOLON character (;), remove the first such character and all
    characters from it up to the end of the string.</p>

    <p>Strip all leading and trailing <a href="common-microsyntaxes.html#space-character" title="space
    character">space characters</a> from <var title="">type</var>.</p>

    <p>If <var title="">type</var> is <em>not</em> now an <a href="infrastructure.html#ascii-case-insensitive">ASCII
    case-insensitive</a> match for the string
    "<code><a href="iana.html#text-html">text/html</a></code>", then act as if the tokenizer had emitted
    a start tag token with the tag name "pre" followed by a single
    U+000A LINE FEED (LF) character, then
    switch the <a href="parsing.html#html-parser">HTML parser</a>'s tokenizer to the
    <a href="tokenization.html#plaintext-state">PLAINTEXT state</a>.</p>


   </li>

   <li>

    <p>Remove all the entries in the <a href="browsers.html#browsing-context">browsing context</a>'s
    <a href="history.html#session-history">session history</a> after the <a href="history.html#current-entry">current
    entry</a>. If the <a href="history.html#current-entry">current entry</a> is the last entry
    in the session history, then no entries are removed.</p>

    <p class="note">This <a href="history.html#history-notes">doesn't necessarily
    have to affect</a> the user agent's user interface.</p>

   </li>

   <li><p>Remove any <a href="webappapis.html#concept-task" title="concept-task">tasks</a> queued by
   the <a href="webappapis.html#history-traversal-task-source">history traversal task source</a>.</p></li>

   <li>Remove any earlier entries that share the same
   <code><a href="infrastructure.html#document">Document</a></code>.</li>

   <li><p>If <var title="">replace</var> is false, then add a new
   entry, just before the last entry, and associate with the new entry
   the text that was parsed by the previous parser associated with the
   <code><a href="infrastructure.html#document">Document</a></code> object, as well as the state of the document
   at the start of these steps. This allows the user to step backwards
   in the session history to see the page before it was blown away by
   the <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code> call.
   This new entry does not have a <code><a href="infrastructure.html#document">Document</a></code> object, so a
   new one will be created if the session history is traversed to that
   entry.</p></li>

   <li><p>Finally, set the <a href="parsing.html#insertion-point">insertion point</a> to point at
   just before the end of the <a href="parsing.html#the-input-stream">input stream</a> (which at this
   point will be empty).</p></li>

   <li><p>Return the <code><a href="infrastructure.html#document">Document</a></code> on which the method was
   invoked.</p></li>

  </ol><p>When called with three or more arguments, the <code title="dom-document-open"><a href="#dom-document-open">open()</a></code> method on the
  <code><a href="dom.html#htmldocument">HTMLDocument</a></code> object must call the <code title="dom-open"><a href="browsers.html#dom-open">open()</a></code> method on the <code><a href="browsers.html#window">Window</a></code>
  object of the <code><a href="dom.html#htmldocument">HTMLDocument</a></code> object, with the same
  arguments as the original call to the <code title="dom-document-open"><a href="#dom-document-open">open()</a></code> method, and return whatever
  that method returned. If the <code><a href="dom.html#htmldocument">HTMLDocument</a></code> object has no
  <code><a href="browsers.html#window">Window</a></code> object, then the method must raise an
  <code><a href="common-dom-interfaces.html#invalid_access_err">INVALID_ACCESS_ERR</a></code> exception.</p>

  </div><h4 id="closing-the-input-stream"><span class="secno">3.5.2 </span>Closing the input stream</h4><dl class="domintro"><dt><var title="">document</var> . <code title="dom-document-close"><a href="#dom-document-close">close</a></code>()</dt>

   <dd>

    <p>Closes the input stream that was opened by the <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code> method.</p>

    <p>Throws an <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception if the
    <code><a href="infrastructure.html#document">Document</a></code> is an <a href="dom.html#xml-documents" title="XML documents">XML
    document</a>.</p>

   </dd>

  </dl><div class="impl">

  <p>The <dfn id="dom-document-close" title="dom-document-close"><code>close()</code></dfn>
  method must run the following steps:</p>

  <ol><li><p>If the <code><a href="infrastructure.html#document">Document</a></code> object is not flagged as an
   <a href="dom.html#html-documents" title="HTML documents">HTML document</a>, throw an
   <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception and abort these
   steps.</p></li>

   <li><p>If there is no <a href="#script-created-parser">script-created parser</a> associated
   with the document, then abort these steps.</p></li>

   <li><p>Insert an <a href="parsing.html#explicit-eof-character">explicit "EOF" character</a> at the end
   of the parser's <a href="parsing.html#the-input-stream">input stream</a>.</p></li>

   <li><p>If there is a <a href="scripting-1.html#pending-parsing-blocking-script">pending parsing-blocking script</a>,
   then abort these steps.</p></li>

   <li><p>Run the tokenizer, processing resulting tokens as they are
   emitted, and stopping when the tokenizer reaches the <a href="parsing.html#explicit-eof-character">explicit
   "EOF" character</a> or <a href="webappapis.html#spin-the-event-loop" title="spin the event loop">spins
   the event loop</a>.</p></li>

  </ol></div><h4 id="document.write"><span class="secno">3.5.3 </span><code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code></h4><dl class="domintro"><dt><var title="">document</var> . <code title="dom-document-write"><a href="#dom-document-write">write</a></code>(<var title="">text</var>...)</dt>

   <dd>

    <p>In general, adds the given string(s) to the
    <code><a href="infrastructure.html#document">Document</a></code>'s input stream.</p>

    <p class="warning">This method has very idiosyncratic behavior. In
    some cases, this method can affect the state of the <a href="parsing.html#html-parser">HTML
    parser</a> while the parser is running, resulting in a DOM that
    does not correspond to the source of the document. In other cases,
    the call can clear the current page first, as if <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code> had been called.
    In yet more cases, the method is simply ignored, or throws an
    exception. To make matters worse, the exact behavior of this
    method can in some cases be dependent on network latency, which
    can lead to failures that are very hard to debug. <strong>For all
    these reasons, use of this method is strongly
    discouraged.</strong></p>

    <p>This method throws an <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception
    when invoked on <a href="dom.html#xml-documents">XML documents</a>.</p>

   </dd>

  </dl><div class="impl">

  <p><code><a href="infrastructure.html#document">Document</a></code> objects have an
  <dfn id="ignore-destructive-writes-counter">ignore-destructive-writes counter</dfn>, which is used in
  conjunction with the processing of <code><a href="scripting-1.html#the-script-element">script</a></code> elements to
  prevent external scripts from being able to use <code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code> to blow away the
  document by implicitly calling <code title="dom-document-open"><a href="#dom-document-open">document.open()</a></code>. Initially, the
  counter must be set to zero.</p>

  <p>The <dfn id="dom-document-write" title="dom-document-write"><code>document.write(...)</code></dfn>
  method must act as follows:</p>

  <ol><li>

    <p>If the method was invoked on an <a href="dom.html#xml-documents" title="XML documents">XML
    document</a>, throw an <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code>
    exception and abort these steps.</p>


   </li>

   <li>

    <p>If the <a href="parsing.html#insertion-point">insertion point</a> is undefined and the
    <code><a href="infrastructure.html#document">Document</a></code>'s <a href="#ignore-destructive-writes-counter">ignore-destructive-writes
    counter</a> is greater than zero, then abort these steps.</p>

   </li>

   <li>

    <p>If the <a href="parsing.html#insertion-point">insertion point</a> is undefined, call the
    <code title="dom-document-open"><a href="#dom-document-open">open()</a></code> method on the <code title="Document"><a href="infrastructure.html#document">document</a></code> object (with no arguments). If
    the user <a href="history.html#refused-to-allow-the-document-to-be-unloaded">refused to allow the document to be
    unloaded</a>, then abort these steps. Otherwise, the
    <a href="parsing.html#insertion-point">insertion point</a> will point at just before the end of
    the (empty) <a href="parsing.html#the-input-stream">input stream</a>.</p>

   </li>

   <li>

    <p>Insert the string consisting of the concatenation of all the
    arguments to the method into the <a href="parsing.html#the-input-stream">input stream</a> just
    before the <a href="parsing.html#insertion-point">insertion point</a>.</p>

   </li>

   <li>

    <p>If the <code><a href="infrastructure.html#document">Document</a></code> object's <a href="dom.html#reload-override-flag">reload override
    flag</a> is set, then append the string consisting of the
    concatenation of all the arguments to the method to the
    <code><a href="infrastructure.html#document">Document</a></code>'s <a href="dom.html#reload-override-buffer">reload override buffer</a>.</p>

   </li>

   <li>

    <p>If there is no <a href="scripting-1.html#pending-parsing-blocking-script">pending parsing-blocking script</a>,
    have the tokenizer process the characters that were inserted, one
    at a time, processing resulting tokens as they are emitted, and
    stopping when the tokenizer reaches the insertion point or when
    the processing of the tokenizer is aborted by the tree
    construction stage (this can happen if a <code><a href="scripting-1.html#the-script-element">script</a></code> end
    tag token is emitted by the tokenizer).

    </p><p class="note">If the <code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code> method was
    called from script executing inline (i.e. executing because the
    parser parsed a set of <code><a href="scripting-1.html#the-script-element">script</a></code> tags), then this is a
    <a href="parsing.html#nestedParsing">reentrant invocation of the
    parser</a>.</p>

   </li>

   <li>

    <p>Finally, return from the method.</p>

   </li>

  </ol></div><h4 id="document.writeln"><span class="secno">3.5.4 </span><code title="dom-document-writeln"><a href="#dom-document-writeln">document.writeln()</a></code></h4><dl class="domintro"><dt><var title="">document</var> . <code title="dom-document-writeln"><a href="#dom-document-writeln">writeln</a></code>(<var title="">text</var>...)</dt>

   <dd>

    <p>Adds the given string(s) to the <code><a href="infrastructure.html#document">Document</a></code>'s input
    stream, followed by a newline character. If necessary, calls the
    <code title="dom-document-open"><a href="#dom-document-open">open()</a></code> method implicitly
    first.</p>

    <p>This method throws an <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> exception
    when invoked on <a href="dom.html#xml-documents">XML documents</a>.</p>

   </dd>

  </dl><div class="impl">

  <p>The <dfn id="dom-document-writeln" title="dom-document-writeln"><code>document.writeln(...)</code></dfn>
  method, when invoked, must act as if the <code title="dom-document-write"><a href="#dom-document-write">document.write()</a></code> method had been
  invoked with the same argument(s), plus an extra argument consisting
  of a string containing a single line feed character (U+000A).</p>

  </div><h4 id="innerhtml"><span class="secno">3.5.5 </span><code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code></h4><p>The <dfn id="dom-innerhtml" title="dom-innerHTML"><code>innerHTML</code></dfn> IDL
  attribute represents the markup of the node's contents.</p><dl class="domintro"><dt><var title="">document</var> . <code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code> [ = <var title="">value</var> ]</dt>

   <dd>

    <p>Returns a fragment of HTML or XML that represents the
    <code><a href="infrastructure.html#document">Document</a></code>.</p>

    <p>Can be set, to replace the <code><a href="infrastructure.html#document">Document</a></code>'s contents
    with the result of parsing the given string.</p>

    <p>In the case of <a href="dom.html#xml-documents">XML documents</a>, will throw an
    <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> if the <code><a href="infrastructure.html#document">Document</a></code> cannot
    be serialized to XML, and a <code><a href="common-dom-interfaces.html#syntax_err">SYNTAX_ERR</a></code> if the given
    string is not well-formed.</p>

   </dd>

   <dt><var title="">element</var> . <code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code> [ = <var title="">value</var> ]</dt>

   <dd>

    <p>Returns a fragment of HTML or XML that represents the element's
    contents.</p>

    <p>Can be set, to replace the contents of the element with nodes
    parsed from the given string.</p>

    <p>In the case of <a href="dom.html#xml-documents">XML documents</a>, will throw an
    <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> if the element cannot be serialized
    to XML, and a <code><a href="common-dom-interfaces.html#syntax_err">SYNTAX_ERR</a></code> if the given string is not
    well-formed.</p>

   </dd>

  </dl><div class="impl">

  <p>On getting, if the node's document is an <a href="dom.html#html-documents" title="HTML
  documents">HTML document</a>, then the attribute must return the
  result of running the <a href="the-end.html#html-fragment-serialization-algorithm">HTML fragment serialization
  algorithm</a> on the node; otherwise, the node's document is an
  <a href="dom.html#xml-documents" title="XML documents">XML document</a>, and the attribute
  must return the result of running the <a href="the-xhtml-syntax.html#xml-fragment-serialization-algorithm">XML fragment
  serialization algorithm</a> on the node instead (this might raise
  an exception instead of returning a string).</p>

  <p>On setting, the following steps must be run:</p>

  <ol><li>

    <p>If the node's document is an <a href="dom.html#html-documents" title="HTML documents">HTML
    document</a>: Invoke the <a href="the-end.html#html-fragment-parsing-algorithm">HTML fragment parsing
    algorithm</a>.</p>

    <p>If the node's document is an <a href="dom.html#xml-documents" title="XML documents">XML
    document</a>: Invoke the <a href="the-xhtml-syntax.html#xml-fragment-parsing-algorithm">XML fragment parsing
    algorithm</a>.</p>

    <p>In either case, the algorithm must be invoked with the string
    being assigned into the <code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code> attribute as the <var title="">input</var>. If the node is an <code><a href="infrastructure.html#element">Element</a></code>
    node, then, in addition, that element must be passed as the <var title="concept-frag-parse-context"><a href="the-end.html#concept-frag-parse-context">context</a></var> element.</p>

    <p>If this raises an exception, then abort these steps.</p>

    <p>Otherwise, let <var title="">new children</var> be the nodes
    returned.</p>

   </li>

   <li>

    <p>If the attribute is being set on a <code><a href="infrastructure.html#document">Document</a></code> node,
    and that document has an <a href="dom.html#active-parser">active parser</a>, then abort
    that parser.</p>

   </li>

   <li>

    <p>Remove the child nodes of the node whose <code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code> attribute is being set,
    firing appropriate mutation events.</p>

   </li>

   <li>

    <p>If the attribute is being set on a <code><a href="infrastructure.html#document">Document</a></code> node,
    let <var title="">target document</var> be that
    <code><a href="infrastructure.html#document">Document</a></code> node. Otherwise, the attribute is being set
    on an <code><a href="infrastructure.html#element">Element</a></code> node; let <var title="">target
    document</var> be the <code title="dom-Node-ownerDocument"><a href="infrastructure.html#dom-node-ownerdocument">ownerDocument</a></code> of that
    <code><a href="infrastructure.html#element">Element</a></code>.</p>

   </li>

   <li>

    <p>Set the <code title="dom-Node-ownerDocument"><a href="infrastructure.html#dom-node-ownerdocument">ownerDocument</a></code> of all the
    nodes in <var title="">new children</var> to the <var title="">target document</var>.</p>

   </li>

   <li>

    <p>Append all the <var title="">new children</var> nodes to the
    node whose <code title="dom-innerHTML"><a href="#dom-innerhtml">innerHTML</a></code> attribute
    is being set, preserving their order, and firing mutation events
    as if a <code><a href="infrastructure.html#documentfragment">DocumentFragment</a></code> containing the <var title="">new children</var> had been inserted.</p>

   </li>

  </ol></div><h4 id="outerhtml"><span class="secno">3.5.6 </span><code title="dom-outerHTML"><a href="#dom-outerhtml">outerHTML</a></code></h4><p>The <dfn id="dom-outerhtml" title="dom-outerHTML"><code>outerHTML</code></dfn> IDL
  attribute represents the markup of the element and its contents.</p><dl class="domintro"><dt><var title="">element</var> . <code title="dom-outerHTML"><a href="#dom-outerhtml">outerHTML</a></code> [ = <var title="">value</var> ]</dt>

   <dd>

    <p>Returns a fragment of HTML or XML that represents the element
    and its contents.</p>

    <p>Can be set, to replace the element with nodes parsed from the
    given string.</p>

    <p>In the case of <a href="dom.html#xml-documents">XML documents</a>, will throw an
    <code><a href="common-dom-interfaces.html#invalid_state_err">INVALID_STATE_ERR</a></code> if the element cannot be serialized
    to XML, and a <code><a href="common-dom-interfaces.html#syntax_err">SYNTAX_ERR</a></code> if the given string is not
    well-formed.</p>

    <p>Throws a <code><a href="common-dom-interfaces.html#no_modification_allowed_err">NO_MODIFICATION_ALLOWED_ERR</a></code> exception if
    the parent of the element is the <code><a href="infrastructure.html#document">Document</a></code>
    node.</p>

   </dd>

  </dl><div class="impl">

  <p>On getting, if the node's document is an <a href="dom.html#html-documents" title="HTML
  documents">HTML document</a>, then the attribute must return the
  result of running the <a href="the-end.html#html-fragment-serialization-algorithm">HTML fragment serialization
  algorithm</a> on a fictional node whose only child is the node on
  which the attribute was invoked; otherwise, the node's document is
  an <a href="dom.html#xml-documents" title="XML documents">XML document</a>, and the
  attribute must return the result of running the <a href="the-xhtml-syntax.html#xml-fragment-serialization-algorithm">XML fragment
  serialization algorithm</a> on that fictional node instead (this
  might raise an exception instead of returning a string).</p>

  <p>On setting, the following steps must be run:</p>

  <ol><li>

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

   </li>

   <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>

   <li>

    <p>If <var title="">target</var>'s parent node is a
    <code><a href="infrastructure.html#document">Document</a></code> object, throw a
    <code><a href="common-dom-interfaces.html#no_modification_allowed_err">NO_MODIFICATION_ALLOWED_ERR</a></code> exception and abort these
    steps.</p>

   </li>

   <li>

    <p>Let <var title="">parent</var> be <var title="">target</var>'s
    parent node, unless that is a <code><a href="infrastructure.html#documentfragment">DocumentFragment</a></code> node,
    in which case let <var title="">parent</var> be an arbitrary
    <code><a href="sections.html#the-body-element">body</a></code> element.</p>

   </li>

   <li>

    <p>If <var title="">target</var>'s document is an <a href="dom.html#html-documents" title="HTML documents">HTML document</a>: Invoke the <a href="the-end.html#html-fragment-parsing-algorithm">HTML
    fragment parsing algorithm</a>.</p>

    <p>If <var title="">target</var>'s document is an <a href="dom.html#xml-documents" title="XML
    documents">XML document</a>: Invoke the <a href="the-xhtml-syntax.html#xml-fragment-parsing-algorithm">XML fragment
    parsing algorithm</a>.</p>

    <p>In either case, the algorithm must be invoked with the string
    being assigned into the <code title="dom-outerHTML"><a href="#dom-outerhtml">outerHTML</a></code> attribute as the <var title="">input</var>, and <var title="">parent</var> as the <var title="concept-frag-parse-context"><a href="the-end.html#concept-frag-parse-context">context</a></var> element.</p>

    <p>If this raises an exception, then abort these steps.</p>

    <p>Otherwise, let <var title="">new children</var> be the nodes
    returned.</p>

   </li>

   <li>

    <p>Set the <code title="dom-Node-ownerDocument"><a href="infrastructure.html#dom-node-ownerdocument">ownerDocument</a></code> of all the
    nodes in <var title="">new children</var> to <var title="">target</var>'s document.</p>

   </li>

   <li>

    <p>Remove <var title="">target</var> from its parent node, firing
    mutation events as appropriate, and then insert in its place all
    the <var title="">new children</var> nodes, preserving their
    order, and again firing mutation events as if a
    <code><a href="infrastructure.html#documentfragment">DocumentFragment</a></code> containing the <var title="">new
    children</var> had been inserted.</p>

   </li>

  </ol></div><h4 id="insertadjacenthtml"><span class="secno">3.5.7 </span><code title="dom-insertAdjacentHTML"><a href="#dom-insertadjacenthtml">insertAdjacentHTML()</a></code></h4><dl class="domintro"><dt><var title="">element</var> . <code title="dom-insertAdjacentHTML"><a href="#dom-insertadjacenthtml">insertAdjacentHTML</a></code>(<var title="">position</var>, <var title="">text</var>)</dt>

   <dd>

    <p>Parses the given string <var title="">text</var> as HTML or XML
    and inserts the resulting nodes into the tree in the position
    given by the <var title="">position</var> argument, as
    follows:</p>

    <dl><dt>"beforebegin"</dt>
     <dd>Before the element itself.</dd>
     <dt>"afterbegin"</dt>
     <dd>Just inside the element, before its first child.</dd>
     <dt>"beforeend"</dt>
     <dd>Just inside the element, after its last child.</dd>
     <dt>"afterend"</dt>
     <dd>After the element itself.</dd>
    </dl><p>Throws a <code><a href="common-dom-interfaces.html#syntax_err">SYNTAX_ERR</a></code> exception if the arguments
    have invalid values (e.g., in the case of <a href="dom.html#xml-documents">XML
    documents</a>, if the given string is not well-formed).</p>

    <p>Throws a <code><a href="common-dom-interfaces.html#no_modification_allowed_err">NO_MODIFICATION_ALLOWED_ERR</a></code> exception if
    the given position isn't possible (e.g. inserting elements after
    the root element of a <code><a href="infrastructure.html#document">Document</a></code>).</p>

   </dd>

  </dl><div class="impl">

  <p>The <dfn id="dom-insertadjacenthtml" title="dom-insertAdjacentHTML"><code>insertAdjacentHTML(<var title="">position</var>, <var title="">text</var>)</code></dfn>
  method, when invoked, must run the following algorithm:</p>

  <ol><li>

    <p>Let <var title="">position</var> and <var title="">text</var>
    be the method's first and second arguments, respectively.</p>

   </li>

   <li>

    <p>Let <var title="">target</var> be the element on which the
    method was invoked.</p>

   </li>

   <li>

    <p>Use the first matching item from this list:</p>

    <dl><dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "beforebegin"</dt>
     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "afterend"</dt>

     <dd>

      <p>If <var title="">target</var> has no parent node, then abort
      these steps.</p>

      <p>If <var title="">target</var>'s parent node is a
      <code><a href="infrastructure.html#document">Document</a></code> object, then throw a
      <code><a href="common-dom-interfaces.html#no_modification_allowed_err">NO_MODIFICATION_ALLOWED_ERR</a></code> exception and abort
      these steps.

      </p><p>Otherwise, let <var title="">destination</var> be the parent node
      of <var title="">target</var>.</p>

     </dd>

     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "afterbegin"</dt>
     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "beforeend"</dt>

     <dd>

      <p>Let <var title="">destination</var> be the same as <var title="">target</var>.</p>

     </dd>

     <dt>Otherwise</dt>

     <dd>

      <p>Throw a <code><a href="common-dom-interfaces.html#syntax_err">SYNTAX_ERR</a></code> exception.</p>

     </dd>

    </dl></li>

   <li>

    <p>If <var title="">target</var>'s document is an <a href="dom.html#html-documents" title="HTML documents">HTML document</a>: Invoke the <a href="the-end.html#html-fragment-parsing-algorithm">HTML
    fragment parsing algorithm</a>.</p>

    <p>If <var title="">target</var>'s document is an <a href="dom.html#xml-documents" title="XML
    documents">XML document</a>: Invoke the <a href="the-xhtml-syntax.html#xml-fragment-parsing-algorithm">XML fragment
    parsing algorithm</a>.</p>

    <p>In either case, the algorithm must be invoked with <var title="">text</var> as the <var title="">input</var>, and <var title="">destination</var> as the <var title="concept-frag-parse-context"><a href="the-end.html#concept-frag-parse-context">context</a></var> element.</p>

    <p>If this raises an exception, then abort these steps.</p>

    <p>Otherwise, let <var title="">new children</var> be the nodes
    returned.</p>

   </li>

   <li>

    <p>Set the <code title="dom-Node-ownerDocument"><a href="infrastructure.html#dom-node-ownerdocument">ownerDocument</a></code> of all the
    nodes in <var title="">new children</var> to <var title="">target</var>'s document.</p>

   </li>

   <li>

    <p>Use the first matching item from this list:</p>

    <dl><dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "beforebegin"</dt>

     <dd>

      <p>Insert all the <var title="">new children</var> nodes
      immediately before <var title="">target</var>.</p>

     </dd>

     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "afterbegin"</dt>

     <dd>

      <p>Insert all the <var title="">new children</var> nodes before
      the first child of <var title="">target</var>, if there is
      one. If there is no such child, append them all to <var title="">target</var>.</p>

     </dd>

     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "beforeend"</dt>

     <dd>

      <p>Append all the <var title="">new children</var> nodes to <var title="">target</var>.</p>

     </dd>

     <dt>If <var title="">position</var> is an <a href="infrastructure.html#ascii-case-insensitive">ASCII
     case-insensitive</a> match for the string "afterend"</dt>

     <dd>

      <p>Insert all the <var title="">new children</var> nodes
      immediately after <var title="">target</var>.</p>

     </dd>

    </dl><p>The <var title="">new children</var> nodes must be inserted in
    a manner that preserves their order and fires mutation events as
    if a <code><a href="infrastructure.html#documentfragment">DocumentFragment</a></code> containing the <var title="">new children</var> had been inserted.</p>

   </li>

  </ol></div></body></html>