mozilla

Compare Revisions

Using the W3C DOM

Change Revisions

Revision 5167:

Revision 5167 by Dhtmlkitchen@gmail.com on

Revision 5168:

Revision 5168 by GT on

Title:
Using the W3C DOM
Using the W3C DOM
Slug:
Using_Web_Standards_in_your_Web_Pages/Using_the_W3C_DOM
Using_Web_Standards_in_your_Web_Pages/Using_the_W3C_DOM
Tags:
"Web Standards", "Web Development"
"Web Standards", "Web Development"
Content:

Revision 5167
Revision 5168
nn8      <br>
9      <a class="external" href="http://developer.mozilla.org/en/d
 >ocs/Using_Web_Standards_in_your_Web_Pages:Making_your_page_using_
 >web_standards_-_how_to">&lt;- Previous section: Using web standar
 >ds: how</a>
10    </p>
11    <p style="text-align: right;">
12      <a class="external" href="http://developer.mozilla.org/en/d
 >ocs/Using_Web_Standards_in_your_Web_Pages:Developing_Cross_Browse
 >r/Cross_Platform_Pages">Next section: Developing Cross-browser pa
 >ges -&gt;</a>
13    </p>
14    <p>
15      <br>
8      The <code>document</code> objects for some browsers have pr16      The <code>document</code> objects for some browsers have pr
>operties for accessing collections of elements. <code>document.al>operties for accessing collections of elements. <code>document.al
>l[]</code>, for example, is used by Internet Explorer to access e>l[]</code>, for example, is used by Internet Explorer to access e
>lements within the document. Many of these collections were not m>lements within the document. Many of these collections were not m
>ade a part of the <abbr title="World Wide Web Consortium">W3C</ab>ade a part of the <abbr title="World Wide Web Consortium">W3C</ab
>br> specification for the Document Object Model and will cause Ja>br> specification for the Document Object Model and will cause Ja
>vaScript errors in standards-compliant browsers like Firefox, Sea>vaScript errors in standards-compliant browsers like Firefox, Sea
>monkey and Netscape 7+.>monkey and Camino.
9    </p>
10    <p>17    </p>
18    <p>
11      The <a class="external" href="http://www.w3.org/DOM/DOMTR">19      The <a class="external" href="http://www.w3.org/DOM/DOMTR">
><abbr title="World Wide Web Consortium">W3C</abbr> Document Objec><abbr title="World Wide Web Consortium">W3C</abbr> Document Objec
>t Model</a> exposes almost all of the elements in an HTML page as>t Model</a> exposes almost all of the elements in an HTML page as
> scriptable objects. In general the attributes and methods of the> scriptable objects. In general the attributes and methods of the
> <abbr title="World Wide Web Consortium">W3C</abbr> DOM are more > <abbr title="World Wide Web Consortium">W3C</abbr> DOM are more 
>powerful than the proprietary object models used in DHTML program>powerful than the proprietary object models used in DHTML program
>ming. <strong>The attributes and methods of the <abbr title="Worl>ming. <strong>The attributes and methods of the <abbr title="Worl
>d Wide Web Consortium">W3C</abbr> DOM are overall well supported >d Wide Web Consortium">W3C</abbr> DOM are overall well supported 
>by modern browsers like MSIE 7, Opera 9, Safari 2, Konqueror 3.x >by modern browsers like MSIE 7, Opera 9.5, Safari 3, Konqueror 
>and Mozilla-based browsers (Firefox, Seamonkey, Netscape 7+, Cami>and Mozilla-based browsers (Firefox, Seamonkey, Camino): so there
>no): so there is no gain from relying on proprietary object model> is no gain from relying on proprietary object models</strong>.
>s</strong>. 
n54      Scripts that use these properties will not execute in Firefn62      Scripts that use these properties will not execute in Firef
>ox, Mozilla and Netscape 7+ or other standards-compliant browsers>ox, Camino, Seamonkey or other standards-compliant browsers. <str
>. <strong>Instead, use the <abbr title="World Wide Web Consortium>ong>Instead, use the <abbr title="World Wide Web Consortium">W3C<
>">W3C</abbr> DOM access attributes and access methods described i>/abbr> DOM access attributes and access methods described in the 
>n the next section; since these are supported by Internet Explore>next section; since these are supported by Internet Explorer too,
>r too, then there is no need to use MSIE-specific attributes and > then there is no need to use MSIE-specific attributes and method
>methods.</strong>>s.</strong>
n60      <strong>The best and most supported practice for getting scn68      <strong>The best and most supported practice for getting sc
>riptable access to an element in an HTML page is to use <code>doc>riptable access to an element in an HTML page is to use <code>doc
>ument.getElementById(<var>id</var>)</code>.</strong> A very wide >ument.getElementById(<var>id</var>)</code>.</strong> A very wide 
>majority of browsers (Firefox, NS 7+, SeamonkeyOpera 6+, Safari>majority of browsers (Firefox, SeamonkeyOpera, SafariKonquero
> 1.x, Konqueror 3.x, etc.) support document.getElementById(<var>i>r, etc.) support document.getElementById(<var>id</var>). This met
>d</var>). This method returns <strong>a reference to the uniquely>hod returns <strong>a reference to the uniquely identified elemen
> identified element</strong>, which can then be used to script th>t</strong>, which can then be used to script that element. For ex
>at element. For example, the following short sample dynamically s>ample, the following short sample dynamically sets the left margi
>ets the left margin of a <code>div</code> element with an <code>i>n of a <code>div</code> element with an <code>id</code> of "inset
>d</code> of "inset" to half an inch:>" to half an inch:
61    </p>
62    <p>69    </p>
70    <p>
63      MSIE5-7 have partially broken support, returning the first 71      MSIE 5-7 have partially broken support, returning the first
>element with a matching <code>NAME</code> or <code>ID</code> (<a > element with a matching <code>NAME</code> or <code>ID</code> (<a
>class="external" href="http://www.gtalbot.org/BrowserBugsSection/> class="external" href="http://www.gtalbot.org/BrowserBugsSection
>MSIE6Bugs/IdVersusName.html">Id versus name when using getElement>/MSIE6Bugs/IdVersusName.html">Id versus name when using getElemen
>ById</a>, <a class="external" href="http://msdn2.microsoft.com/en>tById</a>, <a class="external" href="http://msdn2.microsoft.com/e
>-us/library/ms536437(VS.85).aspx">MSDN</a>).>n-us/library/ms536437(VS.85).aspx">MSDN</a>).
n71        <tr style="text-align: center;">n79        <tr>
n166    <p>n174    <p id="dom_manip">
167      <span id="dom_manip"></span> The following table describes 175      The following table describes standards-based methods for a
>standards-based methods for accessing and updating style rules de>ccessing and updating style rules defined for various HTML elemen
>fined for various HTML elements in a web page. See the <abbr titl>ts in a web page. See the <abbr title="World Wide Web Consortium"
>e="World Wide Web Consortium">W3C</abbr> DOM2 Recommendation, <a >>W3C</abbr> DOM2 Recommendation, <a class="external" href="http:/
>class="external" href="http://www.w3.org/TR/2000/REC-DOM-Level-2->/www.w3.org/TR/2000/REC-DOM-Level-2-Style-20001113/css.html#CSS-e
>Style-20001113/css.html#CSS-extended">CSS2 Extended Interface</a>>xtended">CSS2 Extended Interface</a>.
>. 
n174        <tr style="text-align: center;">n182        <tr>
n245      If the element has no sub-elements, just text, then it (norn253      If the element has no sub-elements, just text, then it (nor
>mally) has one child node, accessed as <code>ElemRef.childNodes{{>mally) has one child node, accessed as <code>ElemRef.childNodes{{
>mediawiki.external(0)}}</code>. In such precise case, the W3C web>mediawiki.external(0)}}</code>. In such precise case, the W3C web
> standards equivalent of <code>ElemRef.innerText</code> is <code>> standards equivalent of <code>ElemRef.innerText</code> is <code>
>ElemRef.childNodes{{mediawiki.external(0)}}.nodeValue</code>. <sp>ElemRef.childNodes{{mediawiki.external(0)}}.nodeValue</code>. <sp
>an class="comment">We could introduce DOM 3 Core textContent attr>an class="comment">We could introduce DOM 3 Core textContent attr
>ibute here which is supported by Mozilla 1.5+, Safari 2.x, Opera >ibute here which is supported by Mozilla 1.5+, Safari 2.x, Opera 
>9.x and is a perfect equivalent to MSIE's innerText. http://www.w>9.x, Konqueror 3.5+ and is a perfect equivalent to MSIE's innerTe
>3.org/TR/2004/REC-DOM-Level-3-Core-20040407/core.html#Node3-textC>xt. http://www.w3.org/TR/2004/REC-DOM-Level-3-Core-20040407/core.
>ontent</span>>html#Node3-textContent</span>
n287      It should be clear that translating scripts to modify documn295      It should be clear that translating scripts to modify docum
>ent content is not a trivial undertaking. The benefit of such a c>ent content is not a trivial undertaking. The benefit of such a c
>onversion is that the script will work in modern, <abbr title="Wo>onversion is that the script will work in modern, <abbr title="Wo
>rld Wide Web Consortium">W3C</abbr> DOM-compliant browsers such a>rld Wide Web Consortium">W3C</abbr> DOM-compliant browsers such a
>s Firefox 2, Seamonkey 1, Netscape 7+ and other Gecko-based brows>s Firefox 3, Seamonkey 2, Camino 1.6 and other Gecko-based browse
>ers. Requirements of backward compatibility, however, will not on>rs. Requirements of backward compatibility, however, will not onl
>ly prolong but worsen the difficulties of dealing with multiple p>y prolong but worsen the difficulties of dealing with multiple pl
>latforms.>atforms.
tt317    <p>
318      <br>
319      <a class="external" href="http://developer.mozilla.org/en/d
 >ocs/Using_Web_Standards_in_your_Web_Pages:Making_your_page_using_
 >web_standards_-_how_to">&lt;- Previous section: Using web standar
 >ds: how</a>
320    </p>
321    <p style="text-align: right;">
322      <a class="external" href="http://developer.mozilla.org/en/d
 >ocs/Using_Web_Standards_in_your_Web_Pages:Developing_Cross_Browse
 >r/Cross_Platform_Pages">Next section: Developing Cross-browser pa
 >ges -&gt;</a>
323    </p>

Back to History