selenium-webdriver

Version:

The official WebDriver JavaScript bindings from the Selenium project

1 lines • 264 kB

HTML

<!DOCTYPE html><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"><meta http-equiv="Content-Language" content="en"><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>dom.js</title><link href="../../../../dossier.css" rel="stylesheet" type="text/css"><header><div><form><div><input type="search" placeholder="Search"></div></form></div></header><main><article class="srcfile"><h1>lib/goog/dom/dom.js</h1><div><table><tr><td><a id="l1"></a><a href="#l1">1</a><td>// Copyright 2006 The Closure Library Authors. All Rights Reserved.<tr><td><a id="l2"></a><a href="#l2">2</a><td>//<tr><td><a id="l3"></a><a href="#l3">3</a><td>// Licensed under the Apache License, Version 2.0 (the "License");<tr><td><a id="l4"></a><a href="#l4">4</a><td>// you may not use this file except in compliance with the License.<tr><td><a id="l5"></a><a href="#l5">5</a><td>// You may obtain a copy of the License at<tr><td><a id="l6"></a><a href="#l6">6</a><td>//<tr><td><a id="l7"></a><a href="#l7">7</a><td>// http://www.apache.org/licenses/LICENSE-2.0<tr><td><a id="l8"></a><a href="#l8">8</a><td>//<tr><td><a id="l9"></a><a href="#l9">9</a><td>// Unless required by applicable law or agreed to in writing, software<tr><td><a id="l10"></a><a href="#l10">10</a><td>// distributed under the License is distributed on an "AS-IS" BASIS,<tr><td><a id="l11"></a><a href="#l11">11</a><td>// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.<tr><td><a id="l12"></a><a href="#l12">12</a><td>// See the License for the specific language governing permissions and<tr><td><a id="l13"></a><a href="#l13">13</a><td>// limitations under the License.<tr><td><a id="l14"></a><a href="#l14">14</a><td><tr><td><a id="l15"></a><a href="#l15">15</a><td>/**<tr><td><a id="l16"></a><a href="#l16">16</a><td> * @fileoverview Utilities for manipulating the browser's Document Object Model<tr><td><a id="l17"></a><a href="#l17">17</a><td> * Inspiration taken *heavily* from mochikit (http://mochikit.com/).<tr><td><a id="l18"></a><a href="#l18">18</a><td> *<tr><td><a id="l19"></a><a href="#l19">19</a><td> * You can use {@link goog.dom.DomHelper} to create new dom helpers that refer<tr><td><a id="l20"></a><a href="#l20">20</a><td> * to a different document object. This is useful if you are working with<tr><td><a id="l21"></a><a href="#l21">21</a><td> * frames or multiple windows.<tr><td><a id="l22"></a><a href="#l22">22</a><td> *<tr><td><a id="l23"></a><a href="#l23">23</a><td> * @author arv@google.com (Erik Arvidsson)<tr><td><a id="l24"></a><a href="#l24">24</a><td> */<tr><td><a id="l25"></a><a href="#l25">25</a><td><tr><td><a id="l26"></a><a href="#l26">26</a><td><tr><td><a id="l27"></a><a href="#l27">27</a><td>// TODO(arv): Rename/refactor getTextContent and getRawTextContent. The problem<tr><td><a id="l28"></a><a href="#l28">28</a><td>// is that getTextContent should mimic the DOM3 textContent. We should add a<tr><td><a id="l29"></a><a href="#l29">29</a><td>// getInnerText (or getText) which tries to return the visible text, innerText.<tr><td><a id="l30"></a><a href="#l30">30</a><td><tr><td><a id="l31"></a><a href="#l31">31</a><td><tr><td><a id="l32"></a><a href="#l32">32</a><td>goog.provide('goog.dom');<tr><td><a id="l33"></a><a href="#l33">33</a><td>goog.provide('goog.dom.Appendable');<tr><td><a id="l34"></a><a href="#l34">34</a><td>goog.provide('goog.dom.DomHelper');<tr><td><a id="l35"></a><a href="#l35">35</a><td><tr><td><a id="l36"></a><a href="#l36">36</a><td>goog.require('goog.array');<tr><td><a id="l37"></a><a href="#l37">37</a><td>goog.require('goog.asserts');<tr><td><a id="l38"></a><a href="#l38">38</a><td>goog.require('goog.dom.BrowserFeature');<tr><td><a id="l39"></a><a href="#l39">39</a><td>goog.require('goog.dom.NodeType');<tr><td><a id="l40"></a><a href="#l40">40</a><td>goog.require('goog.dom.TagName');<tr><td><a id="l41"></a><a href="#l41">41</a><td>goog.require('goog.math.Coordinate');<tr><td><a id="l42"></a><a href="#l42">42</a><td>goog.require('goog.math.Size');<tr><td><a id="l43"></a><a href="#l43">43</a><td>goog.require('goog.object');<tr><td><a id="l44"></a><a href="#l44">44</a><td>goog.require('goog.string');<tr><td><a id="l45"></a><a href="#l45">45</a><td>goog.require('goog.userAgent');<tr><td><a id="l46"></a><a href="#l46">46</a><td><tr><td><a id="l47"></a><a href="#l47">47</a><td><tr><td><a id="l48"></a><a href="#l48">48</a><td>/**<tr><td><a id="l49"></a><a href="#l49">49</a><td> * @define {boolean} Whether we know at compile time that the browser is in<tr><td><a id="l50"></a><a href="#l50">50</a><td> * quirks mode.<tr><td><a id="l51"></a><a href="#l51">51</a><td> */<tr><td><a id="l52"></a><a href="#l52">52</a><td>goog.define('goog.dom.ASSUME_QUIRKS_MODE', false);<tr><td><a id="l53"></a><a href="#l53">53</a><td><tr><td><a id="l54"></a><a href="#l54">54</a><td><tr><td><a id="l55"></a><a href="#l55">55</a><td>/**<tr><td><a id="l56"></a><a href="#l56">56</a><td> * @define {boolean} Whether we know at compile time that the browser is in<tr><td><a id="l57"></a><a href="#l57">57</a><td> * standards compliance mode.<tr><td><a id="l58"></a><a href="#l58">58</a><td> */<tr><td><a id="l59"></a><a href="#l59">59</a><td>goog.define('goog.dom.ASSUME_STANDARDS_MODE', false);<tr><td><a id="l60"></a><a href="#l60">60</a><td><tr><td><a id="l61"></a><a href="#l61">61</a><td><tr><td><a id="l62"></a><a href="#l62">62</a><td>/**<tr><td><a id="l63"></a><a href="#l63">63</a><td> * Whether we know the compatibility mode at compile time.<tr><td><a id="l64"></a><a href="#l64">64</a><td> * @type {boolean}<tr><td><a id="l65"></a><a href="#l65">65</a><td> * @private<tr><td><a id="l66"></a><a href="#l66">66</a><td> */<tr><td><a id="l67"></a><a href="#l67">67</a><td>goog.dom.COMPAT_MODE_KNOWN_ =<tr><td><a id="l68"></a><a href="#l68">68</a><td> goog.dom.ASSUME_QUIRKS_MODE || goog.dom.ASSUME_STANDARDS_MODE;<tr><td><a id="l69"></a><a href="#l69">69</a><td><tr><td><a id="l70"></a><a href="#l70">70</a><td><tr><td><a id="l71"></a><a href="#l71">71</a><td>/**<tr><td><a id="l72"></a><a href="#l72">72</a><td> * Gets the DomHelper object for the document where the element resides.<tr><td><a id="l73"></a><a href="#l73">73</a><td> * @param {(Node|Window)=} opt_element If present, gets the DomHelper for this<tr><td><a id="l74"></a><a href="#l74">74</a><td> * element.<tr><td><a id="l75"></a><a href="#l75">75</a><td> * @return {!goog.dom.DomHelper} The DomHelper.<tr><td><a id="l76"></a><a href="#l76">76</a><td> */<tr><td><a id="l77"></a><a href="#l77">77</a><td>goog.dom.getDomHelper = function(opt_element) {<tr><td><a id="l78"></a><a href="#l78">78</a><td> return opt_element ?<tr><td><a id="l79"></a><a href="#l79">79</a><td> new goog.dom.DomHelper(goog.dom.getOwnerDocument(opt_element)) :<tr><td><a id="l80"></a><a href="#l80">80</a><td> (goog.dom.defaultDomHelper_ ||<tr><td><a id="l81"></a><a href="#l81">81</a><td> (goog.dom.defaultDomHelper_ = new goog.dom.DomHelper()));<tr><td><a id="l82"></a><a href="#l82">82</a><td>};<tr><td><a id="l83"></a><a href="#l83">83</a><td><tr><td><a id="l84"></a><a href="#l84">84</a><td><tr><td><a id="l85"></a><a href="#l85">85</a><td>/**<tr><td><a id="l86"></a><a href="#l86">86</a><td> * Cached default DOM helper.<tr><td><a id="l87"></a><a href="#l87">87</a><td> * @type {goog.dom.DomHelper}<tr><td><a id="l88"></a><a href="#l88">88</a><td> * @private<tr><td><a id="l89"></a><a href="#l89">89</a><td> */<tr><td><a id="l90"></a><a href="#l90">90</a><td>goog.dom.defaultDomHelper_;<tr><td><a id="l91"></a><a href="#l91">91</a><td><tr><td><a id="l92"></a><a href="#l92">92</a><td><tr><td><a id="l93"></a><a href="#l93">93</a><td>/**<tr><td><a id="l94"></a><a href="#l94">94</a><td> * Gets the document object being used by the dom library.<tr><td><a id="l95"></a><a href="#l95">95</a><td> * @return {!Document} Document object.<tr><td><a id="l96"></a><a href="#l96">96</a><td> */<tr><td><a id="l97"></a><a href="#l97">97</a><td>goog.dom.getDocument = function() {<tr><td><a id="l98"></a><a href="#l98">98</a><td> return document;<tr><td><a id="l99"></a><a href="#l99">99</a><td>};<tr><td><a id="l100"></a><a href="#l100">100</a><td><tr><td><a id="l101"></a><a href="#l101">101</a><td><tr><td><a id="l102"></a><a href="#l102">102</a><td>/**<tr><td><a id="l103"></a><a href="#l103">103</a><td> * Gets an element from the current document by element id.<tr><td><a id="l104"></a><a href="#l104">104</a><td> *<tr><td><a id="l105"></a><a href="#l105">105</a><td> * If an Element is passed in, it is returned.<tr><td><a id="l106"></a><a href="#l106">106</a><td> *<tr><td><a id="l107"></a><a href="#l107">107</a><td> * @param {string|Element} element Element ID or a DOM node.<tr><td><a id="l108"></a><a href="#l108">108</a><td> * @return {Element} The element with the given ID, or the node passed in.<tr><td><a id="l109"></a><a href="#l109">109</a><td> */<tr><td><a id="l110"></a><a href="#l110">110</a><td>goog.dom.getElement = function(element) {<tr><td><a id="l111"></a><a href="#l111">111</a><td> return goog.dom.getElementHelper_(document, element);<tr><td><a id="l112"></a><a href="#l112">112</a><td>};<tr><td><a id="l113"></a><a href="#l113">113</a><td><tr><td><a id="l114"></a><a href="#l114">114</a><td><tr><td><a id="l115"></a><a href="#l115">115</a><td>/**<tr><td><a id="l116"></a><a href="#l116">116</a><td> * Gets an element by id from the given document (if present).<tr><td><a id="l117"></a><a href="#l117">117</a><td> * If an element is given, it is returned.<tr><td><a id="l118"></a><a href="#l118">118</a><td> * @param {!Document} doc<tr><td><a id="l119"></a><a href="#l119">119</a><td> * @param {string|Element} element Element ID or a DOM node.<tr><td><a id="l120"></a><a href="#l120">120</a><td> * @return {Element} The resulting element.<tr><td><a id="l121"></a><a href="#l121">121</a><td> * @private<tr><td><a id="l122"></a><a href="#l122">122</a><td> */<tr><td><a id="l123"></a><a href="#l123">123</a><td>goog.dom.getElementHelper_ = function(doc, element) {<tr><td><a id="l124"></a><a href="#l124">124</a><td> return goog.isString(element) ?<tr><td><a id="l125"></a><a href="#l125">125</a><td> doc.getElementById(element) :<tr><td><a id="l126"></a><a href="#l126">126</a><td> element;<tr><td><a id="l127"></a><a href="#l127">127</a><td>};<tr><td><a id="l128"></a><a href="#l128">128</a><td><tr><td><a id="l129"></a><a href="#l129">129</a><td><tr><td><a id="l130"></a><a href="#l130">130</a><td>/**<tr><td><a id="l131"></a><a href="#l131">131</a><td> * Gets an element by id, asserting that the element is found.<tr><td><a id="l132"></a><a href="#l132">132</a><td> *<tr><td><a id="l133"></a><a href="#l133">133</a><td> * This is used when an element is expected to exist, and should fail with<tr><td><a id="l134"></a><a href="#l134">134</a><td> * an assertion error if it does not (if assertions are enabled).<tr><td><a id="l135"></a><a href="#l135">135</a><td> *<tr><td><a id="l136"></a><a href="#l136">136</a><td> * @param {string} id Element ID.<tr><td><a id="l137"></a><a href="#l137">137</a><td> * @return {!Element} The element with the given ID, if it exists.<tr><td><a id="l138"></a><a href="#l138">138</a><td> */<tr><td><a id="l139"></a><a href="#l139">139</a><td>goog.dom.getRequiredElement = function(id) {<tr><td><a id="l140"></a><a href="#l140">140</a><td> return goog.dom.getRequiredElementHelper_(document, id);<tr><td><a id="l141"></a><a href="#l141">141</a><td>};<tr><td><a id="l142"></a><a href="#l142">142</a><td><tr><td><a id="l143"></a><a href="#l143">143</a><td><tr><td><a id="l144"></a><a href="#l144">144</a><td>/**<tr><td><a id="l145"></a><a href="#l145">145</a><td> * Helper function for getRequiredElementHelper functions, both static and<tr><td><a id="l146"></a><a href="#l146">146</a><td> * on DomHelper. Asserts the element with the given id exists.<tr><td><a id="l147"></a><a href="#l147">147</a><td> * @param {!Document} doc<tr><td><a id="l148"></a><a href="#l148">148</a><td> * @param {string} id<tr><td><a id="l149"></a><a href="#l149">149</a><td> * @return {!Element} The element with the given ID, if it exists.<tr><td><a id="l150"></a><a href="#l150">150</a><td> * @private<tr><td><a id="l151"></a><a href="#l151">151</a><td> */<tr><td><a id="l152"></a><a href="#l152">152</a><td>goog.dom.getRequiredElementHelper_ = function(doc, id) {<tr><td><a id="l153"></a><a href="#l153">153</a><td> // To prevent users passing in Elements as is permitted in getElement().<tr><td><a id="l154"></a><a href="#l154">154</a><td> goog.asserts.assertString(id);<tr><td><a id="l155"></a><a href="#l155">155</a><td> var element = goog.dom.getElementHelper_(doc, id);<tr><td><a id="l156"></a><a href="#l156">156</a><td> element = goog.asserts.assertElement(element,<tr><td><a id="l157"></a><a href="#l157">157</a><td> 'No element found with id: ' + id);<tr><td><a id="l158"></a><a href="#l158">158</a><td> return element;<tr><td><a id="l159"></a><a href="#l159">159</a><td>};<tr><td><a id="l160"></a><a href="#l160">160</a><td><tr><td><a id="l161"></a><a href="#l161">161</a><td><tr><td><a id="l162"></a><a href="#l162">162</a><td>/**<tr><td><a id="l163"></a><a href="#l163">163</a><td> * Alias for getElement.<tr><td><a id="l164"></a><a href="#l164">164</a><td> * @param {string|Element} element Element ID or a DOM node.<tr><td><a id="l165"></a><a href="#l165">165</a><td> * @return {Element} The element with the given ID, or the node passed in.<tr><td><a id="l166"></a><a href="#l166">166</a><td> * @deprecated Use {@link goog.dom.getElement} instead.<tr><td><a id="l167"></a><a href="#l167">167</a><td> */<tr><td><a id="l168"></a><a href="#l168">168</a><td>goog.dom.$ = goog.dom.getElement;<tr><td><a id="l169"></a><a href="#l169">169</a><td><tr><td><a id="l170"></a><a href="#l170">170</a><td><tr><td><a id="l171"></a><a href="#l171">171</a><td>/**<tr><td><a id="l172"></a><a href="#l172">172</a><td> * Looks up elements by both tag and class name, using browser native functions<tr><td><a id="l173"></a><a href="#l173">173</a><td> * ({@code querySelectorAll}, {@code getElementsByTagName} or<tr><td><a id="l174"></a><a href="#l174">174</a><td> * {@code getElementsByClassName}) where possible. This function<tr><td><a id="l175"></a><a href="#l175">175</a><td> * is a useful, if limited, way of collecting a list of DOM elements<tr><td><a id="l176"></a><a href="#l176">176</a><td> * with certain characteristics. {@code goog.dom.query} offers a<tr><td><a id="l177"></a><a href="#l177">177</a><td> * more powerful and general solution which allows matching on CSS3<tr><td><a id="l178"></a><a href="#l178">178</a><td> * selector expressions, but at increased cost in code size. If all you<tr><td><a id="l179"></a><a href="#l179">179</a><td> * need is particular tags belonging to a single class, this function<tr><td><a id="l180"></a><a href="#l180">180</a><td> * is fast and sleek.<tr><td><a id="l181"></a><a href="#l181">181</a><td> *<tr><td><a id="l182"></a><a href="#l182">182</a><td> * Note that tag names are case sensitive in the SVG namespace, and this<tr><td><a id="l183"></a><a href="#l183">183</a><td> * function converts opt_tag to uppercase for comparisons. For queries in the<tr><td><a id="l184"></a><a href="#l184">184</a><td> * SVG namespace you should use querySelector or querySelectorAll instead.<tr><td><a id="l185"></a><a href="#l185">185</a><td> * https://bugzilla.mozilla.org/show_bug.cgi?id=963870<tr><td><a id="l186"></a><a href="#l186">186</a><td> * https://bugs.webkit.org/show_bug.cgi?id=83438<tr><td><a id="l187"></a><a href="#l187">187</a><td> *<tr><td><a id="l188"></a><a href="#l188">188</a><td> * @see {goog.dom.query}<tr><td><a id="l189"></a><a href="#l189">189</a><td> *<tr><td><a id="l190"></a><a href="#l190">190</a><td> * @param {?string=} opt_tag Element tag name.<tr><td><a id="l191"></a><a href="#l191">191</a><td> * @param {?string=} opt_class Optional class name.<tr><td><a id="l192"></a><a href="#l192">192</a><td> * @param {(Document|Element)=} opt_el Optional element to look in.<tr><td><a id="l193"></a><a href="#l193">193</a><td> * @return { {length: number} } Array-like list of elements (only a length<tr><td><a id="l194"></a><a href="#l194">194</a><td> * property and numerical indices are guaranteed to exist).<tr><td><a id="l195"></a><a href="#l195">195</a><td> */<tr><td><a id="l196"></a><a href="#l196">196</a><td>goog.dom.getElementsByTagNameAndClass = function(opt_tag, opt_class, opt_el) {<tr><td><a id="l197"></a><a href="#l197">197</a><td> return goog.dom.getElementsByTagNameAndClass_(document, opt_tag, opt_class,<tr><td><a id="l198"></a><a href="#l198">198</a><td> opt_el);<tr><td><a id="l199"></a><a href="#l199">199</a><td>};<tr><td><a id="l200"></a><a href="#l200">200</a><td><tr><td><a id="l201"></a><a href="#l201">201</a><td><tr><td><a id="l202"></a><a href="#l202">202</a><td>/**<tr><td><a id="l203"></a><a href="#l203">203</a><td> * Returns a static, array-like list of the elements with the provided<tr><td><a id="l204"></a><a href="#l204">204</a><td> * className.<tr><td><a id="l205"></a><a href="#l205">205</a><td> * @see {goog.dom.query}<tr><td><a id="l206"></a><a href="#l206">206</a><td> * @param {string} className the name of the class to look for.<tr><td><a id="l207"></a><a href="#l207">207</a><td> * @param {(Document|Element)=} opt_el Optional element to look in.<tr><td><a id="l208"></a><a href="#l208">208</a><td> * @return { {length: number} } The items found with the class name provided.<tr><td><a id="l209"></a><a href="#l209">209</a><td> */<tr><td><a id="l210"></a><a href="#l210">210</a><td>goog.dom.getElementsByClass = function(className, opt_el) {<tr><td><a id="l211"></a><a href="#l211">211</a><td> var parent = opt_el || document;<tr><td><a id="l212"></a><a href="#l212">212</a><td> if (goog.dom.canUseQuerySelector_(parent)) {<tr><td><a id="l213"></a><a href="#l213">213</a><td> return parent.querySelectorAll('.' + className);<tr><td><a id="l214"></a><a href="#l214">214</a><td> }<tr><td><a id="l215"></a><a href="#l215">215</a><td> return goog.dom.getElementsByTagNameAndClass_(<tr><td><a id="l216"></a><a href="#l216">216</a><td> document, '*', className, opt_el);<tr><td><a id="l217"></a><a href="#l217">217</a><td>};<tr><td><a id="l218"></a><a href="#l218">218</a><td><tr><td><a id="l219"></a><a href="#l219">219</a><td><tr><td><a id="l220"></a><a href="#l220">220</a><td>/**<tr><td><a id="l221"></a><a href="#l221">221</a><td> * Returns the first element with the provided className.<tr><td><a id="l222"></a><a href="#l222">222</a><td> * @see {goog.dom.query}<tr><td><a id="l223"></a><a href="#l223">223</a><td> * @param {string} className the name of the class to look for.<tr><td><a id="l224"></a><a href="#l224">224</a><td> * @param {Element|Document=} opt_el Optional element to look in.<tr><td><a id="l225"></a><a href="#l225">225</a><td> * @return {Element} The first item with the class name provided.<tr><td><a id="l226"></a><a href="#l226">226</a><td> */<tr><td><a id="l227"></a><a href="#l227">227</a><td>goog.dom.getElementByClass = function(className, opt_el) {<tr><td><a id="l228"></a><a href="#l228">228</a><td> var parent = opt_el || document;<tr><td><a id="l229"></a><a href="#l229">229</a><td> var retVal = null;<tr><td><a id="l230"></a><a href="#l230">230</a><td> if (goog.dom.canUseQuerySelector_(parent)) {<tr><td><a id="l231"></a><a href="#l231">231</a><td> retVal = parent.querySelector('.' + className);<tr><td><a id="l232"></a><a href="#l232">232</a><td> } else {<tr><td><a id="l233"></a><a href="#l233">233</a><td> retVal = goog.dom.getElementsByTagNameAndClass_(<tr><td><a id="l234"></a><a href="#l234">234</a><td> document, '*', className, opt_el)[0];<tr><td><a id="l235"></a><a href="#l235">235</a><td> }<tr><td><a id="l236"></a><a href="#l236">236</a><td> return retVal || null;<tr><td><a id="l237"></a><a href="#l237">237</a><td>};<tr><td><a id="l238"></a><a href="#l238">238</a><td><tr><td><a id="l239"></a><a href="#l239">239</a><td><tr><td><a id="l240"></a><a href="#l240">240</a><td>/**<tr><td><a id="l241"></a><a href="#l241">241</a><td> * Ensures an element with the given className exists, and then returns the<tr><td><a id="l242"></a><a href="#l242">242</a><td> * first element with the provided className.<tr><td><a id="l243"></a><a href="#l243">243</a><td> * @see {goog.dom.query}<tr><td><a id="l244"></a><a href="#l244">244</a><td> * @param {string} className the name of the class to look for.<tr><td><a id="l245"></a><a href="#l245">245</a><td> * @param {!Element|!Document=} opt_root Optional element or document to look<tr><td><a id="l246"></a><a href="#l246">246</a><td> * in.<tr><td><a id="l247"></a><a href="#l247">247</a><td> * @return {!Element} The first item with the class name provided.<tr><td><a id="l248"></a><a href="#l248">248</a><td> * @throws {goog.asserts.AssertionError} Thrown if no element is found.<tr><td><a id="l249"></a><a href="#l249">249</a><td> */<tr><td><a id="l250"></a><a href="#l250">250</a><td>goog.dom.getRequiredElementByClass = function(className, opt_root) {<tr><td><a id="l251"></a><a href="#l251">251</a><td> var retValue = goog.dom.getElementByClass(className, opt_root);<tr><td><a id="l252"></a><a href="#l252">252</a><td> return goog.asserts.assert(retValue,<tr><td><a id="l253"></a><a href="#l253">253</a><td> 'No element found with className: ' + className);<tr><td><a id="l254"></a><a href="#l254">254</a><td>};<tr><td><a id="l255"></a><a href="#l255">255</a><td><tr><td><a id="l256"></a><a href="#l256">256</a><td><tr><td><a id="l257"></a><a href="#l257">257</a><td>/**<tr><td><a id="l258"></a><a href="#l258">258</a><td> * Prefer the standardized (http://www.w3.org/TR/selectors-api/), native and<tr><td><a id="l259"></a><a href="#l259">259</a><td> * fast W3C Selectors API.<tr><td><a id="l260"></a><a href="#l260">260</a><td> * @param {!(Element|Document)} parent The parent document object.<tr><td><a id="l261"></a><a href="#l261">261</a><td> * @return {boolean} whether or not we can use parent.querySelector* APIs.<tr><td><a id="l262"></a><a href="#l262">262</a><td> * @private<tr><td><a id="l263"></a><a href="#l263">263</a><td> */<tr><td><a id="l264"></a><a href="#l264">264</a><td>goog.dom.canUseQuerySelector_ = function(parent) {<tr><td><a id="l265"></a><a href="#l265">265</a><td> return !!(parent.querySelectorAll && parent.querySelector);<tr><td><a id="l266"></a><a href="#l266">266</a><td>};<tr><td><a id="l267"></a><a href="#l267">267</a><td><tr><td><a id="l268"></a><a href="#l268">268</a><td><tr><td><a id="l269"></a><a href="#l269">269</a><td>/**<tr><td><a id="l270"></a><a href="#l270">270</a><td> * Helper for {@code getElementsByTagNameAndClass}.<tr><td><a id="l271"></a><a href="#l271">271</a><td> * @param {!Document} doc The document to get the elements in.<tr><td><a id="l272"></a><a href="#l272">272</a><td> * @param {?string=} opt_tag Element tag name.<tr><td><a id="l273"></a><a href="#l273">273</a><td> * @param {?string=} opt_class Optional class name.<tr><td><a id="l274"></a><a href="#l274">274</a><td> * @param {(Document|Element)=} opt_el Optional element to look in.<tr><td><a id="l275"></a><a href="#l275">275</a><td> * @return { {length: number} } Array-like list of elements (only a length<tr><td><a id="l276"></a><a href="#l276">276</a><td> * property and numerical indices are guaranteed to exist).<tr><td><a id="l277"></a><a href="#l277">277</a><td> * @private<tr><td><a id="l278"></a><a href="#l278">278</a><td> */<tr><td><a id="l279"></a><a href="#l279">279</a><td>goog.dom.getElementsByTagNameAndClass_ = function(doc, opt_tag, opt_class,<tr><td><a id="l280"></a><a href="#l280">280</a><td> opt_el) {<tr><td><a id="l281"></a><a href="#l281">281</a><td> var parent = opt_el || doc;<tr><td><a id="l282"></a><a href="#l282">282</a><td> var tagName = (opt_tag && opt_tag != '*') ? opt_tag.toUpperCase() : '';<tr><td><a id="l283"></a><a href="#l283">283</a><td><tr><td><a id="l284"></a><a href="#l284">284</a><td> if (goog.dom.canUseQuerySelector_(parent) &&<tr><td><a id="l285"></a><a href="#l285">285</a><td> (tagName || opt_class)) {<tr><td><a id="l286"></a><a href="#l286">286</a><td> var query = tagName + (opt_class ? '.' + opt_class : '');<tr><td><a id="l287"></a><a href="#l287">287</a><td> return parent.querySelectorAll(query);<tr><td><a id="l288"></a><a href="#l288">288</a><td> }<tr><td><a id="l289"></a><a href="#l289">289</a><td><tr><td><a id="l290"></a><a href="#l290">290</a><td> // Use the native getElementsByClassName if available, under the assumption<tr><td><a id="l291"></a><a href="#l291">291</a><td> // that even when the tag name is specified, there will be fewer elements to<tr><td><a id="l292"></a><a href="#l292">292</a><td> // filter through when going by class than by tag name<tr><td><a id="l293"></a><a href="#l293">293</a><td> if (opt_class && parent.getElementsByClassName) {<tr><td><a id="l294"></a><a href="#l294">294</a><td> var els = parent.getElementsByClassName(opt_class);<tr><td><a id="l295"></a><a href="#l295">295</a><td><tr><td><a id="l296"></a><a href="#l296">296</a><td> if (tagName) {<tr><td><a id="l297"></a><a href="#l297">297</a><td> var arrayLike = {};<tr><td><a id="l298"></a><a href="#l298">298</a><td> var len = 0;<tr><td><a id="l299"></a><a href="#l299">299</a><td><tr><td><a id="l300"></a><a href="#l300">300</a><td> // Filter for specific tags if requested.<tr><td><a id="l301"></a><a href="#l301">301</a><td> for (var i = 0, el; el = els[i]; i++) {<tr><td><a id="l302"></a><a href="#l302">302</a><td> if (tagName == el.nodeName) {<tr><td><a id="l303"></a><a href="#l303">303</a><td> arrayLike[len++] = el;<tr><td><a id="l304"></a><a href="#l304">304</a><td> }<tr><td><a id="l305"></a><a href="#l305">305</a><td> }<tr><td><a id="l306"></a><a href="#l306">306</a><td> arrayLike.length = len;<tr><td><a id="l307"></a><a href="#l307">307</a><td><tr><td><a id="l308"></a><a href="#l308">308</a><td> return arrayLike;<tr><td><a id="l309"></a><a href="#l309">309</a><td> } else {<tr><td><a id="l310"></a><a href="#l310">310</a><td> return els;<tr><td><a id="l311"></a><a href="#l311">311</a><td> }<tr><td><a id="l312"></a><a href="#l312">312</a><td> }<tr><td><a id="l313"></a><a href="#l313">313</a><td><tr><td><a id="l314"></a><a href="#l314">314</a><td> var els = parent.getElementsByTagName(tagName || '*');<tr><td><a id="l315"></a><a href="#l315">315</a><td><tr><td><a id="l316"></a><a href="#l316">316</a><td> if (opt_class) {<tr><td><a id="l317"></a><a href="#l317">317</a><td> var arrayLike = {};<tr><td><a id="l318"></a><a href="#l318">318</a><td> var len = 0;<tr><td><a id="l319"></a><a href="#l319">319</a><td> for (var i = 0, el; el = els[i]; i++) {<tr><td><a id="l320"></a><a href="#l320">320</a><td> var className = el.className;<tr><td><a id="l321"></a><a href="#l321">321</a><td> // Check if className has a split function since SVG className does not.<tr><td><a id="l322"></a><a href="#l322">322</a><td> if (typeof className.split == 'function' &&<tr><td><a id="l323"></a><a href="#l323">323</a><td> goog.array.contains(className.split(/\s+/), opt_class)) {<tr><td><a id="l324"></a><a href="#l324">324</a><td> arrayLike[len++] = el;<tr><td><a id="l325"></a><a href="#l325">325</a><td> }<tr><td><a id="l326"></a><a href="#l326">326</a><td> }<tr><td><a id="l327"></a><a href="#l327">327</a><td> arrayLike.length = len;<tr><td><a id="l328"></a><a href="#l328">328</a><td> return arrayLike;<tr><td><a id="l329"></a><a href="#l329">329</a><td> } else {<tr><td><a id="l330"></a><a href="#l330">330</a><td> return els;<tr><td><a id="l331"></a><a href="#l331">331</a><td> }<tr><td><a id="l332"></a><a href="#l332">332</a><td>};<tr><td><a id="l333"></a><a href="#l333">333</a><td><tr><td><a id="l334"></a><a href="#l334">334</a><td><tr><td><a id="l335"></a><a href="#l335">335</a><td>/**<tr><td><a id="l336"></a><a href="#l336">336</a><td> * Alias for {@code getElementsByTagNameAndClass}.<tr><td><a id="l337"></a><a href="#l337">337</a><td> * @param {?string=} opt_tag Element tag name.<tr><td><a id="l338"></a><a href="#l338">338</a><td> * @param {?string=} opt_class Optional class name.<tr><td><a id="l339"></a><a href="#l339">339</a><td> * @param {Element=} opt_el Optional element to look in.<tr><td><a id="l340"></a><a href="#l340">340</a><td> * @return { {length: number} } Array-like list of elements (only a length<tr><td><a id="l341"></a><a href="#l341">341</a><td> * property and numerical indices are guaranteed to exist).<tr><td><a id="l342"></a><a href="#l342">342</a><td> * @deprecated Use {@link goog.dom.getElementsByTagNameAndClass} instead.<tr><td><a id="l343"></a><a href="#l343">343</a><td> */<tr><td><a id="l344"></a><a href="#l344">344</a><td>goog.dom.$$ = goog.dom.getElementsByTagNameAndClass;<tr><td><a id="l345"></a><a href="#l345">345</a><td><tr><td><a id="l346"></a><a href="#l346">346</a><td><tr><td><a id="l347"></a><a href="#l347">347</a><td>/**<tr><td><a id="l348"></a><a href="#l348">348</a><td> * Sets multiple properties on a node.<tr><td><a id="l349"></a><a href="#l349">349</a><td> * @param {Element} element DOM node to set properties on.<tr><td><a id="l350"></a><a href="#l350">350</a><td> * @param {Object} properties Hash of property:value pairs.<tr><td><a id="l351"></a><a href="#l351">351</a><td> */<tr><td><a id="l352"></a><a href="#l352">352</a><td>goog.dom.setProperties = function(element, properties) {<tr><td><a id="l353"></a><a href="#l353">353</a><td> goog.object.forEach(properties, function(val, key) {<tr><td><a id="l354"></a><a href="#l354">354</a><td> if (key == 'style') {<tr><td><a id="l355"></a><a href="#l355">355</a><td> element.style.cssText = val;<tr><td><a id="l356"></a><a href="#l356">356</a><td> } else if (key == 'class') {<tr><td><a id="l357"></a><a href="#l357">357</a><td> element.className = val;<tr><td><a id="l358"></a><a href="#l358">358</a><td> } else if (key == 'for') {<tr><td><a id="l359"></a><a href="#l359">359</a><td> element.htmlFor = val;<tr><td><a id="l360"></a><a href="#l360">360</a><td> } else if (key in goog.dom.DIRECT_ATTRIBUTE_MAP_) {<tr><td><a id="l361"></a><a href="#l361">361</a><td> element.setAttribute(goog.dom.DIRECT_ATTRIBUTE_MAP_[key], val);<tr><td><a id="l362"></a><a href="#l362">362</a><td> } else if (goog.string.startsWith(key, 'aria-') ||<tr><td><a id="l363"></a><a href="#l363">363</a><td> goog.string.startsWith(key, 'data-')) {<tr><td><a id="l364"></a><a href="#l364">364</a><td> element.setAttribute(key, val);<tr><td><a id="l365"></a><a href="#l365">365</a><td> } else {<tr><td><a id="l366"></a><a href="#l366">366</a><td> element[key] = val;<tr><td><a id="l367"></a><a href="#l367">367</a><td> }<tr><td><a id="l368"></a><a href="#l368">368</a><td> });<tr><td><a id="l369"></a><a href="#l369">369</a><td>};<tr><td><a id="l370"></a><a href="#l370">370</a><td><tr><td><a id="l371"></a><a href="#l371">371</a><td><tr><td><a id="l372"></a><a href="#l372">372</a><td>/**<tr><td><a id="l373"></a><a href="#l373">373</a><td> * Map of attributes that should be set using<tr><td><a id="l374"></a><a href="#l374">374</a><td> * element.setAttribute(key, val) instead of element[key] = val. Used<tr><td><a id="l375"></a><a href="#l375">375</a><td> * by goog.dom.setProperties.<tr><td><a id="l376"></a><a href="#l376">376</a><td> *<tr><td><a id="l377"></a><a href="#l377">377</a><td> * @private {!Object<string, string>}<tr><td><a id="l378"></a><a href="#l378">378</a><td> * @const<tr><td><a id="l379"></a><a href="#l379">379</a><td> */<tr><td><a id="l380"></a><a href="#l380">380</a><td>goog.dom.DIRECT_ATTRIBUTE_MAP_ = {<tr><td><a id="l381"></a><a href="#l381">381</a><td> 'cellpadding': 'cellPadding',<tr><td><a id="l382"></a><a href="#l382">382</a><td> 'cellspacing': 'cellSpacing',<tr><td><a id="l383"></a><a href="#l383">383</a><td> 'colspan': 'colSpan',<tr><td><a id="l384"></a><a href="#l384">384</a><td> 'frameborder': 'frameBorder',<tr><td><a id="l385"></a><a href="#l385">385</a><td> 'height': 'height',<tr><td><a id="l386"></a><a href="#l386">386</a><td> 'maxlength': 'maxLength',<tr><td><a id="l387"></a><a href="#l387">387</a><td> 'role': 'role',<tr><td><a id="l388"></a><a href="#l388">388</a><td> 'rowspan': 'rowSpan',<tr><td><a id="l389"></a><a href="#l389">389</a><td> 'type': 'type',<tr><td><a id="l390"></a><a href="#l390">390</a><td> 'usemap': 'useMap',<tr><td><a id="l391"></a><a href="#l391">391</a><td> 'valign': 'vAlign',<tr><td><a id="l392"></a><a href="#l392">392</a><td> 'width': 'width'<tr><td><a id="l393"></a><a href="#l393">393</a><td>};<tr><td><a id="l394"></a><a href="#l394">394</a><td><tr><td><a id="l395"></a><a href="#l395">395</a><td><tr><td><a id="l396"></a><a href="#l396">396</a><td>/**<tr><td><a id="l397"></a><a href="#l397">397</a><td> * Gets the dimensions of the viewport.<tr><td><a id="l398"></a><a href="#l398">398</a><td> *<tr><td><a id="l399"></a><a href="#l399">399</a><td> * Gecko Standards mode:<tr><td><a id="l400"></a><a href="#l400">400</a><td> * docEl.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l401"></a><a href="#l401">401</a><td> * win.innerWidth Width of viewport including scrollbar.<tr><td><a id="l402"></a><a href="#l402">402</a><td> * body.clientWidth Width of body element.<tr><td><a id="l403"></a><a href="#l403">403</a><td> *<tr><td><a id="l404"></a><a href="#l404">404</a><td> * docEl.clientHeight Height of viewport excluding scrollbar.<tr><td><a id="l405"></a><a href="#l405">405</a><td> * win.innerHeight Height of viewport including scrollbar.<tr><td><a id="l406"></a><a href="#l406">406</a><td> * body.clientHeight Height of document.<tr><td><a id="l407"></a><a href="#l407">407</a><td> *<tr><td><a id="l408"></a><a href="#l408">408</a><td> * Gecko Backwards compatible mode:<tr><td><a id="l409"></a><a href="#l409">409</a><td> * docEl.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l410"></a><a href="#l410">410</a><td> * win.innerWidth Width of viewport including scrollbar.<tr><td><a id="l411"></a><a href="#l411">411</a><td> * body.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l412"></a><a href="#l412">412</a><td> *<tr><td><a id="l413"></a><a href="#l413">413</a><td> * docEl.clientHeight Height of document.<tr><td><a id="l414"></a><a href="#l414">414</a><td> * win.innerHeight Height of viewport including scrollbar.<tr><td><a id="l415"></a><a href="#l415">415</a><td> * body.clientHeight Height of viewport excluding scrollbar.<tr><td><a id="l416"></a><a href="#l416">416</a><td> *<tr><td><a id="l417"></a><a href="#l417">417</a><td> * IE6/7 Standards mode:<tr><td><a id="l418"></a><a href="#l418">418</a><td> * docEl.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l419"></a><a href="#l419">419</a><td> * win.innerWidth Undefined.<tr><td><a id="l420"></a><a href="#l420">420</a><td> * body.clientWidth Width of body element.<tr><td><a id="l421"></a><a href="#l421">421</a><td> *<tr><td><a id="l422"></a><a href="#l422">422</a><td> * docEl.clientHeight Height of viewport excluding scrollbar.<tr><td><a id="l423"></a><a href="#l423">423</a><td> * win.innerHeight Undefined.<tr><td><a id="l424"></a><a href="#l424">424</a><td> * body.clientHeight Height of document element.<tr><td><a id="l425"></a><a href="#l425">425</a><td> *<tr><td><a id="l426"></a><a href="#l426">426</a><td> * IE5 + IE6/7 Backwards compatible mode:<tr><td><a id="l427"></a><a href="#l427">427</a><td> * docEl.clientWidth 0.<tr><td><a id="l428"></a><a href="#l428">428</a><td> * win.innerWidth Undefined.<tr><td><a id="l429"></a><a href="#l429">429</a><td> * body.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l430"></a><a href="#l430">430</a><td> *<tr><td><a id="l431"></a><a href="#l431">431</a><td> * docEl.clientHeight 0.<tr><td><a id="l432"></a><a href="#l432">432</a><td> * win.innerHeight Undefined.<tr><td><a id="l433"></a><a href="#l433">433</a><td> * body.clientHeight Height of viewport excluding scrollbar.<tr><td><a id="l434"></a><a href="#l434">434</a><td> *<tr><td><a id="l435"></a><a href="#l435">435</a><td> * Opera 9 Standards and backwards compatible mode:<tr><td><a id="l436"></a><a href="#l436">436</a><td> * docEl.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l437"></a><a href="#l437">437</a><td> * win.innerWidth Width of viewport including scrollbar.<tr><td><a id="l438"></a><a href="#l438">438</a><td> * body.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l439"></a><a href="#l439">439</a><td> *<tr><td><a id="l440"></a><a href="#l440">440</a><td> * docEl.clientHeight Height of document.<tr><td><a id="l441"></a><a href="#l441">441</a><td> * win.innerHeight Height of viewport including scrollbar.<tr><td><a id="l442"></a><a href="#l442">442</a><td> * body.clientHeight Height of viewport excluding scrollbar.<tr><td><a id="l443"></a><a href="#l443">443</a><td> *<tr><td><a id="l444"></a><a href="#l444">444</a><td> * WebKit:<tr><td><a id="l445"></a><a href="#l445">445</a><td> * Safari 2<tr><td><a id="l446"></a><a href="#l446">446</a><td> * docEl.clientHeight Same as scrollHeight.<tr><td><a id="l447"></a><a href="#l447">447</a><td> * docEl.clientWidth Same as innerWidth.<tr><td><a id="l448"></a><a href="#l448">448</a><td> * win.innerWidth Width of viewport excluding scrollbar.<tr><td><a id="l449"></a><a href="#l449">449</a><td> * win.innerHeight Height of the viewport including scrollbar.<tr><td><a id="l450"></a><a href="#l450">450</a><td> * frame.innerHeight Height of the viewport exluding scrollbar.<tr><td><a id="l451"></a><a href="#l451">451</a><td> *<tr><td><a id="l452"></a><a href="#l452">452</a><td> * Safari 3 (tested in 522)<tr><td><a id="l453"></a><a href="#l453">453</a><td> *<tr><td><a id="l454"></a><a href="#l454">454</a><td> * docEl.clientWidth Width of viewport excluding scrollbar.<tr><td><a id="l455"></a><a href="#l455">455</a><td> * docEl.clientHeight Height of viewport excluding scrollbar in strict mode.<tr><td><a id="l456"></a><a href="#l456">456</a><td> * body.clientHeight Height of viewport excluding scrollbar in quirks mode.<tr><td><a id="l457"></a><a href="#l457">457</a><td> *<tr><td><a id="l458"></a><a href="#l458">458</a><td> * @param {Window=} opt_window Optional window element to test.<tr><td><a id="l459"></a><a href="#l459">459</a><td> * @return {!goog.math.Size} Object with values 'width' and 'height'.<tr><td><a id="l460"></a><a href="#l460">460</a><td> */<tr><td><a id="l461"></a><a href="#l461">461</a><td>goog.dom.getViewportSize = function(opt_window) {<tr><td><a id="l462"></a><a href="#l462">462</a><td> // TODO(arv): This should not take an argument<tr><td><a id="l463"></a><a href="#l463">463</a><td> return goog.dom.getViewportSize_(opt_window || window);<tr><td><a id="l464"></a><a href="#l464">464</a><td>};<tr><td><a id="l465"></a><a href="#l465">465</a><td><tr><td><a id="l466"></a><a href="#l466">466</a><td><tr><td><a id="l467"></a><a href="#l467">467</a><td>/**<tr><td><a id="l468"></a><a href="#l468">468</a><td> * Helper for {@code getViewportSize}.<tr><td><a id="l469"></a><a href="#l469">469</a><td> * @param {Window} win The window to get the view port size for.<tr><td><a id="l470"></a><a href="#l470">470</a><td> * @return {!goog.math.Size} Object with values 'width' and 'height'.<tr><td><a id="l471"></a><a href="#l471">471</a><td> * @private<tr><td><a id="l472"></a><a href="#l472">472</a><td> */<tr><td><a id="l473"></a><a href="#l473">473</a><td>goog.dom.getViewportSize_ = function(win) {<tr><td><a id="l474"></a><a href="#l474">474</a><td> var doc = win.document;<tr><td><a id="l475"></a><a href="#l475">475</a><td> var el = goog.dom.isCss1CompatMode_(doc) ? doc.documentElement : doc.body;<tr><td><a id="l476"></a><a href="#l476">476</a><td> return new goog.math.Size(el.clientWidth, el.clientHeight);<tr><td><a id="l477"></a><a href="#l477">477</a><td>};<tr><td><a id="l478"></a><a href="#l478">478</a><td><tr><td><a id="l479"></a><a href="#l479">479</a><td><tr><td><a id="l480"></a><a href="#l480">480</a><td>/**<tr><td><a id="l481"></a><a href="#l481">481</a><td> * Calculates the height of the document.<tr><td><a id="l482"></a><a href="#l482">482</a><td> *<tr><td><a id="l483"></a><a href="#l483">483</a><td> * @return {number} The height of the current document.<tr><td><a id="l484"></a><a href="#l484">484</a><td> */<tr><td><a id="l485"></a><a href="#l485">485</a><td>goog.dom.getDocumentHeight = function() {<tr><td><a id="l486"></a><a href="#l486">486</a><td> return goog.dom.getDocumentHeight_(window);<tr><td><a id="l487"></a><a href="#l487">487</a><td>};<tr><td><a id="l488"></a><a href="#l488">488</a><td><tr><td><a id="l489"></a><a href="#l489">489</a><td><tr><td><a id="l490"></a><a href="#l490">490</a><td>/**<tr><td><a id="l491"></a><a href="#l491">491</a><td> * Calculates the height of the document of the given window.<tr><td><a id="l492"></a><a href="#l492">492</a><td> *<tr><td><a id="l493"></a><a href="#l493">493</a><td> * Function code copied from the opensocial gadget api:<tr><td><a id="l494"></a><a href="#l494">494</a><td> * gadgets.window.adjustHeight(opt_height)<tr><td><a id="l495"></a><a href="#l495">495</a><td> *<tr><td><a id="l496"></a><a href="#l496">496</a><td> * @private<tr><td><a id="l497"></a><a href="#l497">497</a><td> * @param {!Window} win The window whose document height to retrieve.<tr><td><a id="l498"></a><a href="#l498">498</a><td> * @return {number} The height of the document of the given window.<tr><td><a id="l499"></a><a href="#l499">499</a><td> */<tr><td><a id="l500"></a><a href="#l500">500</a><td>goog.dom.getDocumentHeight_ = function(win) {<tr><td><a id="l501"></a><a href="#l501">501</a><td> // NOTE(eae): This method will return the window size rather than the document<tr><td><a id="l502"></a><a href="#l502">502</a><td> // size in webkit quirks mode.<tr><td><a id="l503"></a><a href="#l503">503</a><td> var doc = win.document;<tr><td><a id="l504"></a><a href="#l504">504</a><td> var height = 0;<tr><td><a id="l505"></a><a href="#l505">505</a><td><tr><td><a id="l506"></a><a href="#l506">506</a><td> if (doc) {<tr><td><a id="l507"></a><a href="#l507">507</a><td> // Calculating inner content height is hard and different between<tr><td><a id="l508"></a><a href="#l508">508</a><td> // browsers rendering in Strict vs. Quirks mode. We use a combination of<tr><td><a id="l509"></a><a href="#l509">509</a><td> // three properties within document.body and document.documentElement:<tr><td><a id="l510"></a><a href="#l510">510</a><td> // - scrollHeight<tr><td><a id="l511"></a><a href="#l511">511</a><td> // - offsetHeight<tr><td><a id="l512"></a><a href="#l512">512</a><td> // - clientHeight<tr><td><a id="l513"></a><a href="#l513">513</a><td> // These values differ significantly between browsers and rendering modes.<tr><td><a id="l514"></a><a href="#l514">514</a><td> // But there are patterns. It just takes a lot of time and persistence<tr><td><a id="l515"></a><a href="#l515">515</a><td> // to figure out.<tr><td><a id="l516"></a><a href="#l516">516</a><td><tr><td><a id="l517"></a><a href="#l517">517</a><td> var body = doc.body;<tr><td><a id="l518"></a><a href="#l518">518</a><td> var docEl = doc.documentElement;<tr><td><a id="l519"></a><a href="#l519">519</a><td> if (!(docEl && body)) {<tr><td><a id="l520"></a><a href="#l520">520</a><td> return 0;<tr><td><a id="l521"></a><a href="#l521">521</a><td> }<tr><td><a id="l522"></a><a href="#l522">522</a><td><tr><td><a id="l523"></a><a href="#l523">523</a><td> // Get the height of the viewport<tr><td><a id="l524"></a><a href="#l524">524</a><td> var vh = goog.dom.getViewportSize_(win).height;<tr><td><a id="l525"></a><a href="#l525">525</a><td> if (goog.dom.isCss1CompatMode_(doc) && docEl.scrollHeight) {<tr><td><a id="l526"></a><a href="#l526">526</a><td> // In Strict mode:<tr><td><a id="l527"></a><a href="#l527">527</a><td> // The inner content height is contained in either:<tr><td><a id="l528"></a><a href="#l528">528</a><td> // document.documentElement.scrollHeight<tr><td><a id="l529"></a><a href="#l529">529</a><td> // document.documentElement.offsetHeight<tr><td><a id="l530"></a><a href="#l530">530</a><td> // Based on studying the values output by different browsers,<tr><td><a id="l531"></a><a href="#l531">531</a><td> // use the value that's NOT equal to the viewport height found above.<tr><td><a id="l532"></a><a href="#l532">532</a><td> height = docEl.scrollHeight != vh ?<tr><td><a id="l533"></a><a href="#l533">533</a><td> docEl.scrollHeight : docEl.offsetHeight;<tr><td><a id="l534"></a><a href="#l534">534</a><td> } else {<tr><td><a id="l535"></a><a href="#l535">535</a><td> // In Quirks mode:<tr><td><a id="l536"></a><a href="#l536">536</a><td> // documentElement.clientHeight is equal to documentElement.offsetHeight<tr><td><a id="l537"></a><a href="#l537">537</a><td> // except in IE. In most browsers, document.documentElement can be used<tr><td><a id="l538"></a><a href="#l538">538</a><td> // to calculate the inner content height.<tr><td><a id="l539"></a><a href="#l539">539</a><td> // However, in other browsers (e.g. IE), document.body must be used<tr><td><a id="l540"></a><a href="#l540">540</a><td> // instead. How do we know which one to use?<tr><td><a id="l541"></a><a href="#l541">541</a><td> // If document.documentElement.clientHeight does NOT equal<tr><td><a id="l542"></a><a href="#l542">542</a><td> // document.documentElement.offsetHeight, then use document.body.<tr><td><a id="l543"></a><a href="#l543">543</a><td> var sh = docEl.scrollHeight;<tr><td><a id="l544"></a><a href="#l544">544</a><td> var oh = docEl.offsetHeight;<tr><td><a id="l545"></a><a href="#l545">545</a><td> if (docEl.clientHeight != oh) {<tr><td><a id="l546"></a><a href="#l546">546</a><td> sh = body.scrollHeight;<tr><td><a id="l547"></a><a href="#l547">547</a><td> oh = body.offsetHeight;<tr><td><a id="l548"></a><a href="#l548">548</a><td> }<tr><td><a id="l549"></a><a href="#l549">549</a><td><tr><td><a id="l550"></a><a href="#l550">550</a><td> // Detect whether the inner content height is bigger or smaller<tr><td><a id="l551"></a><a href="#l551">551</a><td> // than the bounding box (viewport). If bigger, take the larger<tr><td><a id="l552"></a><a href="#l552">552</a><td> // value. If smaller, take the smaller value.<tr><td><a id="l553"></a><a href="#l553">553</a><td> if (sh > vh) {<tr><td><a id="l554"></a><a href="#l554">554</a><td> // Content is larger<tr><td><a id="l555"></a><a href="#l555">555</a><td> height = sh > oh ? sh : oh;<tr><td><a id="l556"></a><a href="#l556">556</a><td> } else {<tr><td><a id="l557"></a><a href="#l557">557</a><td> // Content is smaller<tr><td><a id="l558"></a><a href="#l558">558</a><td> height = sh < oh ? sh : oh;<tr><td><a id="l559"></a><a href="#l559">559</a><td> }<tr><td><a id="l560"></a><a href="#l560">560</a><td> }<tr><td><a id="l561"></a><a href="#l561">561</a><td> }<tr><td><a id="l562"></a><a href="#l562">562</a><td><tr><td><a id="l563"></a><a href="#l563">563</a><td> return height;<tr><td><a id="l564"></a><a href="#l564">564</a><td>};<tr><td><a id="l565"></a><a href="#l565">565</a><td><tr><td><a id="l566"></a><a href="#l566">566</a><td><tr><td><a id="l567"></a><a href="#l567">567</a><td>/**<tr><td><a id="l568"></a><a href="#l568">568</a><td> * Gets the page scroll distance as a coordinate object.<tr><td><a id="l569"></a><a href="#l569">569</a><td> *<tr><td><a id="l570"></a><a href="#l570">570</a><td> * @param {Window=} opt_window Optional window element to test.<tr><td><a id="l571"></a><a href="#l571">571</a><td> * @return {!goog.math.Coordinate} Object with values 'x' and 'y'.<tr><td><a id="l572"></a><a href="#l572">572</a><td> * @deprecated Use {@link goog.dom.getDocumentScroll} instead.<tr><td><a id="l573"></a><a href="#l573">573</a><td> */<tr><td><a id="l574"></a><a href="#l574">574</a><td>goog.dom.getPageScroll = function(opt_window) {<tr><td><a id="l575"></a><a href="#l575">575</a><td> var win = opt_window || goog.global || window;<tr><td><a id="l576"></a><a href="#l576">576</a><td> return goog.dom.getDomHelper(win.document).getDocumentScroll();<tr><td><a id="l577"></a><a href="#l577">577</a><td>};<tr><td><a id="l578"></a><a href="#l578">578</a><td><tr><td><a id="l579"></a><a href="#l579">579</a><td><tr><td><a id="l580"></a><a href="#l580">580</a><td>/**<tr><td><a id="l581"></a><a href="#l581">581</a><td> * Gets the document scroll distance as a coordinate object.<tr><td><a id="l582"></a><a href="#l582">582</a><td> *<tr><td><a id="l583"></a><a href="#l583">583</a><td> * @return {!goog.math.Coordinate} Object with values 'x' and 'y'.<tr><td><a id="l584"></a><a href="#l584">584</a><td> */<tr><td><a id="l585"></a><a href="#l585">585</a><td>goog.dom.getDocumentScroll = functi