lib/goog/dom/dom.js

1// Copyright 2006 The Closure Library Authors. All Rights Reserved.
2//
3// Licensed under the Apache License, Version 2.0 (the "License");
4// you may not use this file except in compliance with the License.
5// You may obtain a copy of the License at
6//
7// http://www.apache.org/licenses/LICENSE-2.0
8//
9// Unless required by applicable law or agreed to in writing, software
10// distributed under the License is distributed on an "AS-IS" BASIS,
11// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12// See the License for the specific language governing permissions and
13// limitations under the License.
14
15/**
16 * @fileoverview Utilities for manipulating the browser's Document Object Model
17 * Inspiration taken *heavily* from mochikit (http://mochikit.com/).
18 *
19 * You can use {@link goog.dom.DomHelper} to create new dom helpers that refer
20 * to a different document object. This is useful if you are working with
21 * frames or multiple windows.
22 *
23 * @author arv@google.com (Erik Arvidsson)
24 */
25
26
27// TODO(arv): Rename/refactor getTextContent and getRawTextContent. The problem
28// is that getTextContent should mimic the DOM3 textContent. We should add a
29// getInnerText (or getText) which tries to return the visible text, innerText.
30
31
32goog.provide('goog.dom');
33goog.provide('goog.dom.Appendable');
34goog.provide('goog.dom.DomHelper');
35
36goog.require('goog.array');
37goog.require('goog.asserts');
38goog.require('goog.dom.BrowserFeature');
39goog.require('goog.dom.NodeType');
40goog.require('goog.dom.TagName');
41goog.require('goog.math.Coordinate');
42goog.require('goog.math.Size');
43goog.require('goog.object');
44goog.require('goog.string');
45goog.require('goog.userAgent');
46
47
48/**
49 * @define {boolean} Whether we know at compile time that the browser is in
50 * quirks mode.
51 */
52goog.define('goog.dom.ASSUME_QUIRKS_MODE', false);
53
54
55/**
56 * @define {boolean} Whether we know at compile time that the browser is in
57 * standards compliance mode.
58 */
59goog.define('goog.dom.ASSUME_STANDARDS_MODE', false);
60
61
62/**
63 * Whether we know the compatibility mode at compile time.
64 * @type {boolean}
65 * @private
66 */
67goog.dom.COMPAT_MODE_KNOWN_ =
68 goog.dom.ASSUME_QUIRKS_MODE || goog.dom.ASSUME_STANDARDS_MODE;
69
70
71/**
72 * Gets the DomHelper object for the document where the element resides.
73 * @param {(Node|Window)=} opt_element If present, gets the DomHelper for this
74 * element.
75 * @return {!goog.dom.DomHelper} The DomHelper.
76 */
77goog.dom.getDomHelper = function(opt_element) {
78 return opt_element ?
79 new goog.dom.DomHelper(goog.dom.getOwnerDocument(opt_element)) :
80 (goog.dom.defaultDomHelper_ ||
81 (goog.dom.defaultDomHelper_ = new goog.dom.DomHelper()));
82};
83
84
85/**
86 * Cached default DOM helper.
87 * @type {goog.dom.DomHelper}
88 * @private
89 */
90goog.dom.defaultDomHelper_;
91
92
93/**
94 * Gets the document object being used by the dom library.
95 * @return {!Document} Document object.
96 */
97goog.dom.getDocument = function() {
98 return document;
99};
100
101
102/**
103 * Gets an element from the current document by element id.
104 *
105 * If an Element is passed in, it is returned.
106 *
107 * @param {string|Element} element Element ID or a DOM node.
108 * @return {Element} The element with the given ID, or the node passed in.
109 */
110goog.dom.getElement = function(element) {
111 return goog.dom.getElementHelper_(document, element);
112};
113
114
115/**
116 * Gets an element by id from the given document (if present).
117 * If an element is given, it is returned.
118 * @param {!Document} doc
119 * @param {string|Element} element Element ID or a DOM node.
120 * @return {Element} The resulting element.
121 * @private
122 */
123goog.dom.getElementHelper_ = function(doc, element) {
124 return goog.isString(element) ?
125 doc.getElementById(element) :
126 element;
127};
128
129
130/**
131 * Gets an element by id, asserting that the element is found.
132 *
133 * This is used when an element is expected to exist, and should fail with
134 * an assertion error if it does not (if assertions are enabled).
135 *
136 * @param {string} id Element ID.
137 * @return {!Element} The element with the given ID, if it exists.
138 */
139goog.dom.getRequiredElement = function(id) {
140 return goog.dom.getRequiredElementHelper_(document, id);
141};
142
143
144/**
145 * Helper function for getRequiredElementHelper functions, both static and
146 * on DomHelper. Asserts the element with the given id exists.
147 * @param {!Document} doc
148 * @param {string} id
149 * @return {!Element} The element with the given ID, if it exists.
150 * @private
151 */
152goog.dom.getRequiredElementHelper_ = function(doc, id) {
153 // To prevent users passing in Elements as is permitted in getElement().
154 goog.asserts.assertString(id);
155 var element = goog.dom.getElementHelper_(doc, id);
156 element = goog.asserts.assertElement(element,
157 'No element found with id: ' + id);
158 return element;
159};
160
161
162/**
163 * Alias for getElement.
164 * @param {string|Element} element Element ID or a DOM node.
165 * @return {Element} The element with the given ID, or the node passed in.
166 * @deprecated Use {@link goog.dom.getElement} instead.
167 */
168goog.dom.$ = goog.dom.getElement;
169
170
171/**
172 * Looks up elements by both tag and class name, using browser native functions
173 * ({@code querySelectorAll}, {@code getElementsByTagName} or
174 * {@code getElementsByClassName}) where possible. This function
175 * is a useful, if limited, way of collecting a list of DOM elements
176 * with certain characteristics. {@code goog.dom.query} offers a
177 * more powerful and general solution which allows matching on CSS3
178 * selector expressions, but at increased cost in code size. If all you
179 * need is particular tags belonging to a single class, this function
180 * is fast and sleek.
181 *
182 * Note that tag names are case sensitive in the SVG namespace, and this
183 * function converts opt_tag to uppercase for comparisons. For queries in the
184 * SVG namespace you should use querySelector or querySelectorAll instead.
185 * https://bugzilla.mozilla.org/show_bug.cgi?id=963870
186 * https://bugs.webkit.org/show_bug.cgi?id=83438
187 *
188 * @see {goog.dom.query}
189 *
190 * @param {?string=} opt_tag Element tag name.
191 * @param {?string=} opt_class Optional class name.
192 * @param {(Document|Element)=} opt_el Optional element to look in.
193 * @return { {length: number} } Array-like list of elements (only a length
194 * property and numerical indices are guaranteed to exist).
195 */
196goog.dom.getElementsByTagNameAndClass = function(opt_tag, opt_class, opt_el) {
197 return goog.dom.getElementsByTagNameAndClass_(document, opt_tag, opt_class,
198 opt_el);
199};
200
201
202/**
203 * Returns a static, array-like list of the elements with the provided
204 * className.
205 * @see {goog.dom.query}
206 * @param {string} className the name of the class to look for.
207 * @param {(Document|Element)=} opt_el Optional element to look in.
208 * @return { {length: number} } The items found with the class name provided.
209 */
210goog.dom.getElementsByClass = function(className, opt_el) {
211 var parent = opt_el || document;
212 if (goog.dom.canUseQuerySelector_(parent)) {
213 return parent.querySelectorAll('.' + className);
214 }
215 return goog.dom.getElementsByTagNameAndClass_(
216 document, '*', className, opt_el);
217};
218
219
220/**
221 * Returns the first element with the provided className.
222 * @see {goog.dom.query}
223 * @param {string} className the name of the class to look for.
224 * @param {Element|Document=} opt_el Optional element to look in.
225 * @return {Element} The first item with the class name provided.
226 */
227goog.dom.getElementByClass = function(className, opt_el) {
228 var parent = opt_el || document;
229 var retVal = null;
230 if (goog.dom.canUseQuerySelector_(parent)) {
231 retVal = parent.querySelector('.' + className);
232 } else {
233 retVal = goog.dom.getElementsByTagNameAndClass_(
234 document, '*', className, opt_el)[0];
235 }
236 return retVal || null;
237};
238
239
240/**
241 * Ensures an element with the given className exists, and then returns the
242 * first element with the provided className.
243 * @see {goog.dom.query}
244 * @param {string} className the name of the class to look for.
245 * @param {!Element|!Document=} opt_root Optional element or document to look
246 * in.
247 * @return {!Element} The first item with the class name provided.
248 * @throws {goog.asserts.AssertionError} Thrown if no element is found.
249 */
250goog.dom.getRequiredElementByClass = function(className, opt_root) {
251 var retValue = goog.dom.getElementByClass(className, opt_root);
252 return goog.asserts.assert(retValue,
253 'No element found with className: ' + className);
254};
255
256
257/**
258 * Prefer the standardized (http://www.w3.org/TR/selectors-api/), native and
259 * fast W3C Selectors API.
260 * @param {!(Element|Document)} parent The parent document object.
261 * @return {boolean} whether or not we can use parent.querySelector* APIs.
262 * @private
263 */
264goog.dom.canUseQuerySelector_ = function(parent) {
265 return !!(parent.querySelectorAll && parent.querySelector);
266};
267
268
269/**
270 * Helper for {@code getElementsByTagNameAndClass}.
271 * @param {!Document} doc The document to get the elements in.
272 * @param {?string=} opt_tag Element tag name.
273 * @param {?string=} opt_class Optional class name.
274 * @param {(Document|Element)=} opt_el Optional element to look in.
275 * @return { {length: number} } Array-like list of elements (only a length
276 * property and numerical indices are guaranteed to exist).
277 * @private
278 */
279goog.dom.getElementsByTagNameAndClass_ = function(doc, opt_tag, opt_class,
280 opt_el) {
281 var parent = opt_el || doc;
282 var tagName = (opt_tag && opt_tag != '*') ? opt_tag.toUpperCase() : '';
283
284 if (goog.dom.canUseQuerySelector_(parent) &&
285 (tagName || opt_class)) {
286 var query = tagName + (opt_class ? '.' + opt_class : '');
287 return parent.querySelectorAll(query);
288 }
289
290 // Use the native getElementsByClassName if available, under the assumption
291 // that even when the tag name is specified, there will be fewer elements to
292 // filter through when going by class than by tag name
293 if (opt_class && parent.getElementsByClassName) {
294 var els = parent.getElementsByClassName(opt_class);
295
296 if (tagName) {
297 var arrayLike = {};
298 var len = 0;
299
300 // Filter for specific tags if requested.
301 for (var i = 0, el; el = els[i]; i++) {
302 if (tagName == el.nodeName) {
303 arrayLike[len++] = el;
304 }
305 }
306 arrayLike.length = len;
307
308 return arrayLike;
309 } else {
310 return els;
311 }
312 }
313
314 var els = parent.getElementsByTagName(tagName || '*');
315
316 if (opt_class) {
317 var arrayLike = {};
318 var len = 0;
319 for (var i = 0, el; el = els[i]; i++) {
320 var className = el.className;
321 // Check if className has a split function since SVG className does not.
322 if (typeof className.split == 'function' &&
323 goog.array.contains(className.split(/\s+/), opt_class)) {
324 arrayLike[len++] = el;
325 }
326 }
327 arrayLike.length = len;
328 return arrayLike;
329 } else {
330 return els;
331 }
332};
333
334
335/**
336 * Alias for {@code getElementsByTagNameAndClass}.
337 * @param {?string=} opt_tag Element tag name.
338 * @param {?string=} opt_class Optional class name.
339 * @param {Element=} opt_el Optional element to look in.
340 * @return { {length: number} } Array-like list of elements (only a length
341 * property and numerical indices are guaranteed to exist).
342 * @deprecated Use {@link goog.dom.getElementsByTagNameAndClass} instead.
343 */
344goog.dom.$$ = goog.dom.getElementsByTagNameAndClass;
345
346
347/**
348 * Sets multiple properties on a node.
349 * @param {Element} element DOM node to set properties on.
350 * @param {Object} properties Hash of property:value pairs.
351 */
352goog.dom.setProperties = function(element, properties) {
353 goog.object.forEach(properties, function(val, key) {
354 if (key == 'style') {
355 element.style.cssText = val;
356 } else if (key == 'class') {
357 element.className = val;
358 } else if (key == 'for') {
359 element.htmlFor = val;
360 } else if (key in goog.dom.DIRECT_ATTRIBUTE_MAP_) {
361 element.setAttribute(goog.dom.DIRECT_ATTRIBUTE_MAP_[key], val);
362 } else if (goog.string.startsWith(key, 'aria-') ||
363 goog.string.startsWith(key, 'data-')) {
364 element.setAttribute(key, val);
365 } else {
366 element[key] = val;
367 }
368 });
369};
370
371
372/**
373 * Map of attributes that should be set using
374 * element.setAttribute(key, val) instead of element[key] = val. Used
375 * by goog.dom.setProperties.
376 *
377 * @private {!Object<string, string>}
378 * @const
379 */
380goog.dom.DIRECT_ATTRIBUTE_MAP_ = {
381 'cellpadding': 'cellPadding',
382 'cellspacing': 'cellSpacing',
383 'colspan': 'colSpan',
384 'frameborder': 'frameBorder',
385 'height': 'height',
386 'maxlength': 'maxLength',
387 'role': 'role',
388 'rowspan': 'rowSpan',
389 'type': 'type',
390 'usemap': 'useMap',
391 'valign': 'vAlign',
392 'width': 'width'
393};
394
395
396/**
397 * Gets the dimensions of the viewport.
398 *
399 * Gecko Standards mode:
400 * docEl.clientWidth Width of viewport excluding scrollbar.
401 * win.innerWidth Width of viewport including scrollbar.
402 * body.clientWidth Width of body element.
403 *
404 * docEl.clientHeight Height of viewport excluding scrollbar.
405 * win.innerHeight Height of viewport including scrollbar.
406 * body.clientHeight Height of document.
407 *
408 * Gecko Backwards compatible mode:
409 * docEl.clientWidth Width of viewport excluding scrollbar.
410 * win.innerWidth Width of viewport including scrollbar.
411 * body.clientWidth Width of viewport excluding scrollbar.
412 *
413 * docEl.clientHeight Height of document.
414 * win.innerHeight Height of viewport including scrollbar.
415 * body.clientHeight Height of viewport excluding scrollbar.
416 *
417 * IE6/7 Standards mode:
418 * docEl.clientWidth Width of viewport excluding scrollbar.
419 * win.innerWidth Undefined.
420 * body.clientWidth Width of body element.
421 *
422 * docEl.clientHeight Height of viewport excluding scrollbar.
423 * win.innerHeight Undefined.
424 * body.clientHeight Height of document element.
425 *
426 * IE5 + IE6/7 Backwards compatible mode:
427 * docEl.clientWidth 0.
428 * win.innerWidth Undefined.
429 * body.clientWidth Width of viewport excluding scrollbar.
430 *
431 * docEl.clientHeight 0.
432 * win.innerHeight Undefined.
433 * body.clientHeight Height of viewport excluding scrollbar.
434 *
435 * Opera 9 Standards and backwards compatible mode:
436 * docEl.clientWidth Width of viewport excluding scrollbar.
437 * win.innerWidth Width of viewport including scrollbar.
438 * body.clientWidth Width of viewport excluding scrollbar.
439 *
440 * docEl.clientHeight Height of document.
441 * win.innerHeight Height of viewport including scrollbar.
442 * body.clientHeight Height of viewport excluding scrollbar.
443 *
444 * WebKit:
445 * Safari 2
446 * docEl.clientHeight Same as scrollHeight.
447 * docEl.clientWidth Same as innerWidth.
448 * win.innerWidth Width of viewport excluding scrollbar.
449 * win.innerHeight Height of the viewport including scrollbar.
450 * frame.innerHeight Height of the viewport exluding scrollbar.
451 *
452 * Safari 3 (tested in 522)
453 *
454 * docEl.clientWidth Width of viewport excluding scrollbar.
455 * docEl.clientHeight Height of viewport excluding scrollbar in strict mode.
456 * body.clientHeight Height of viewport excluding scrollbar in quirks mode.
457 *
458 * @param {Window=} opt_window Optional window element to test.
459 * @return {!goog.math.Size} Object with values 'width' and 'height'.
460 */
461goog.dom.getViewportSize = function(opt_window) {
462 // TODO(arv): This should not take an argument
463 return goog.dom.getViewportSize_(opt_window || window);
464};
465
466
467/**
468 * Helper for {@code getViewportSize}.
469 * @param {Window} win The window to get the view port size for.
470 * @return {!goog.math.Size} Object with values 'width' and 'height'.
471 * @private
472 */
473goog.dom.getViewportSize_ = function(win) {
474 var doc = win.document;
475 var el = goog.dom.isCss1CompatMode_(doc) ? doc.documentElement : doc.body;
476 return new goog.math.Size(el.clientWidth, el.clientHeight);
477};
478
479
480/**
481 * Calculates the height of the document.
482 *
483 * @return {number} The height of the current document.
484 */
485goog.dom.getDocumentHeight = function() {
486 return goog.dom.getDocumentHeight_(window);
487};
488
489
490/**
491 * Calculates the height of the document of the given window.
492 *
493 * Function code copied from the opensocial gadget api:
494 * gadgets.window.adjustHeight(opt_height)
495 *
496 * @private
497 * @param {!Window} win The window whose document height to retrieve.
498 * @return {number} The height of the document of the given window.
499 */
500goog.dom.getDocumentHeight_ = function(win) {
501 // NOTE(eae): This method will return the window size rather than the document
502 // size in webkit quirks mode.
503 var doc = win.document;
504 var height = 0;
505
506 if (doc) {
507 // Calculating inner content height is hard and different between
508 // browsers rendering in Strict vs. Quirks mode. We use a combination of
509 // three properties within document.body and document.documentElement:
510 // - scrollHeight
511 // - offsetHeight
512 // - clientHeight
513 // These values differ significantly between browsers and rendering modes.
514 // But there are patterns. It just takes a lot of time and persistence
515 // to figure out.
516
517 var body = doc.body;
518 var docEl = doc.documentElement;
519 if (!(docEl && body)) {
520 return 0;
521 }
522
523 // Get the height of the viewport
524 var vh = goog.dom.getViewportSize_(win).height;
525 if (goog.dom.isCss1CompatMode_(doc) && docEl.scrollHeight) {
526 // In Strict mode:
527 // The inner content height is contained in either:
528 // document.documentElement.scrollHeight
529 // document.documentElement.offsetHeight
530 // Based on studying the values output by different browsers,
531 // use the value that's NOT equal to the viewport height found above.
532 height = docEl.scrollHeight != vh ?
533 docEl.scrollHeight : docEl.offsetHeight;
534 } else {
535 // In Quirks mode:
536 // documentElement.clientHeight is equal to documentElement.offsetHeight
537 // except in IE. In most browsers, document.documentElement can be used
538 // to calculate the inner content height.
539 // However, in other browsers (e.g. IE), document.body must be used
540 // instead. How do we know which one to use?
541 // If document.documentElement.clientHeight does NOT equal
542 // document.documentElement.offsetHeight, then use document.body.
543 var sh = docEl.scrollHeight;
544 var oh = docEl.offsetHeight;
545 if (docEl.clientHeight != oh) {
546 sh = body.scrollHeight;
547 oh = body.offsetHeight;
548 }
549
550 // Detect whether the inner content height is bigger or smaller
551 // than the bounding box (viewport). If bigger, take the larger
552 // value. If smaller, take the smaller value.
553 if (sh > vh) {
554 // Content is larger
555 height = sh > oh ? sh : oh;
556 } else {
557 // Content is smaller
558 height = sh < oh ? sh : oh;
559 }
560 }
561 }
562
563 return height;
564};
565
566
567/**
568 * Gets the page scroll distance as a coordinate object.
569 *
570 * @param {Window=} opt_window Optional window element to test.
571 * @return {!goog.math.Coordinate} Object with values 'x' and 'y'.
572 * @deprecated Use {@link goog.dom.getDocumentScroll} instead.
573 */
574goog.dom.getPageScroll = function(opt_window) {
575 var win = opt_window || goog.global || window;
576 return goog.dom.getDomHelper(win.document).getDocumentScroll();
577};
578
579
580/**
581 * Gets the document scroll distance as a coordinate object.
582 *
583 * @return {!goog.math.Coordinate} Object with values 'x' and 'y'.
584 */
585goog.dom.getDocumentScroll = function() {
586 return goog.dom.getDocumentScroll_(document);
587};
588
589
590/**
591 * Helper for {@code getDocumentScroll}.
592 *
593 * @param {!Document} doc The document to get the scroll for.
594 * @return {!goog.math.Coordinate} Object with values 'x' and 'y'.
595 * @private
596 */
597goog.dom.getDocumentScroll_ = function(doc) {
598 var el = goog.dom.getDocumentScrollElement_(doc);
599 var win = goog.dom.getWindow_(doc);
600 if (goog.userAgent.IE && goog.userAgent.isVersionOrHigher('10') &&
601 win.pageYOffset != el.scrollTop) {
602 // The keyboard on IE10 touch devices shifts the page using the pageYOffset
603 // without modifying scrollTop. For this case, we want the body scroll
604 // offsets.
605 return new goog.math.Coordinate(el.scrollLeft, el.scrollTop);
606 }
607 return new goog.math.Coordinate(win.pageXOffset || el.scrollLeft,
608 win.pageYOffset || el.scrollTop);
609};
610
611
612/**
613 * Gets the document scroll element.
614 * @return {!Element} Scrolling element.
615 */
616goog.dom.getDocumentScrollElement = function() {
617 return goog.dom.getDocumentScrollElement_(document);
618};
619
620
621/**
622 * Helper for {@code getDocumentScrollElement}.
623 * @param {!Document} doc The document to get the scroll element for.
624 * @return {!Element} Scrolling element.
625 * @private
626 */
627goog.dom.getDocumentScrollElement_ = function(doc) {
628 // WebKit needs body.scrollLeft in both quirks mode and strict mode. We also
629 // default to the documentElement if the document does not have a body (e.g.
630 // a SVG document).
631 if (!goog.userAgent.WEBKIT && goog.dom.isCss1CompatMode_(doc)) {
632 return doc.documentElement;
633 }
634 return doc.body || doc.documentElement;
635};
636
637
638/**
639 * Gets the window object associated with the given document.
640 *
641 * @param {Document=} opt_doc Document object to get window for.
642 * @return {!Window} The window associated with the given document.
643 */
644goog.dom.getWindow = function(opt_doc) {
645 // TODO(arv): This should not take an argument.
646 return opt_doc ? goog.dom.getWindow_(opt_doc) : window;
647};
648
649
650/**
651 * Helper for {@code getWindow}.
652 *
653 * @param {!Document} doc Document object to get window for.
654 * @return {!Window} The window associated with the given document.
655 * @private
656 */
657goog.dom.getWindow_ = function(doc) {
658 return doc.parentWindow || doc.defaultView;
659};
660
661
662/**
663 * Returns a dom node with a set of attributes. This function accepts varargs
664 * for subsequent nodes to be added. Subsequent nodes will be added to the
665 * first node as childNodes.
666 *
667 * So:
668 * <code>createDom('div', null, createDom('p'), createDom('p'));</code>
669 * would return a div with two child paragraphs
670 *
671 * @param {string} tagName Tag to create.
672 * @param {(Object|Array<string>|string)=} opt_attributes If object, then a map
673 * of name-value pairs for attributes. If a string, then this is the
674 * className of the new element. If an array, the elements will be joined
675 * together as the className of the new element.
676 * @param {...(Object|string|Array|NodeList)} var_args Further DOM nodes or
677 * strings for text nodes. If one of the var_args is an array or NodeList,i
678 * its elements will be added as childNodes instead.
679 * @return {!Element} Reference to a DOM node.
680 */
681goog.dom.createDom = function(tagName, opt_attributes, var_args) {
682 return goog.dom.createDom_(document, arguments);
683};
684
685
686/**
687 * Helper for {@code createDom}.
688 * @param {!Document} doc The document to create the DOM in.
689 * @param {!Arguments} args Argument object passed from the callers. See
690 * {@code goog.dom.createDom} for details.
691 * @return {!Element} Reference to a DOM node.
692 * @private
693 */
694goog.dom.createDom_ = function(doc, args) {
695 var tagName = args[0];
696 var attributes = args[1];
697
698 // Internet Explorer is dumb: http://msdn.microsoft.com/workshop/author/
699 // dhtml/reference/properties/name_2.asp
700 // Also does not allow setting of 'type' attribute on 'input' or 'button'.
701 if (!goog.dom.BrowserFeature.CAN_ADD_NAME_OR_TYPE_ATTRIBUTES && attributes &&
702 (attributes.name || attributes.type)) {
703 var tagNameArr = ['<', tagName];
704 if (attributes.name) {
705 tagNameArr.push(' name="', goog.string.htmlEscape(attributes.name),
706 '"');
707 }
708 if (attributes.type) {
709 tagNameArr.push(' type="', goog.string.htmlEscape(attributes.type),
710 '"');
711
712 // Clone attributes map to remove 'type' without mutating the input.
713 var clone = {};
714 goog.object.extend(clone, attributes);
715
716 // JSCompiler can't see how goog.object.extend added this property,
717 // because it was essentially added by reflection.
718 // So it needs to be quoted.
719 delete clone['type'];
720
721 attributes = clone;
722 }
723 tagNameArr.push('>');
724 tagName = tagNameArr.join('');
725 }
726
727 var element = doc.createElement(tagName);
728
729 if (attributes) {
730 if (goog.isString(attributes)) {
731 element.className = attributes;
732 } else if (goog.isArray(attributes)) {
733 element.className = attributes.join(' ');
734 } else {
735 goog.dom.setProperties(element, attributes);
736 }
737 }
738
739 if (args.length > 2) {
740 goog.dom.append_(doc, element, args, 2);
741 }
742
743 return element;
744};
745
746
747/**
748 * Appends a node with text or other nodes.
749 * @param {!Document} doc The document to create new nodes in.
750 * @param {!Node} parent The node to append nodes to.
751 * @param {!Arguments} args The values to add. See {@code goog.dom.append}.
752 * @param {number} startIndex The index of the array to start from.
753 * @private
754 */
755goog.dom.append_ = function(doc, parent, args, startIndex) {
756 function childHandler(child) {
757 // TODO(user): More coercion, ala MochiKit?
758 if (child) {
759 parent.appendChild(goog.isString(child) ?
760 doc.createTextNode(child) : child);
761 }
762 }
763
764 for (var i = startIndex; i < args.length; i++) {
765 var arg = args[i];
766 // TODO(attila): Fix isArrayLike to return false for a text node.
767 if (goog.isArrayLike(arg) && !goog.dom.isNodeLike(arg)) {
768 // If the argument is a node list, not a real array, use a clone,
769 // because forEach can't be used to mutate a NodeList.
770 goog.array.forEach(goog.dom.isNodeList(arg) ?
771 goog.array.toArray(arg) : arg,
772 childHandler);
773 } else {
774 childHandler(arg);
775 }
776 }
777};
778
779
780/**
781 * Alias for {@code createDom}.
782 * @param {string} tagName Tag to create.
783 * @param {(string|Object)=} opt_attributes If object, then a map of name-value
784 * pairs for attributes. If a string, then this is the className of the new
785 * element.
786 * @param {...(Object|string|Array|NodeList)} var_args Further DOM nodes or
787 * strings for text nodes. If one of the var_args is an array, its
788 * children will be added as childNodes instead.
789 * @return {!Element} Reference to a DOM node.
790 * @deprecated Use {@link goog.dom.createDom} instead.
791 */
792goog.dom.$dom = goog.dom.createDom;
793
794
795/**
796 * Creates a new element.
797 * @param {string} name Tag name.
798 * @return {!Element} The new element.
799 */
800goog.dom.createElement = function(name) {
801 return document.createElement(name);
802};
803
804
805/**
806 * Creates a new text node.
807 * @param {number|string} content Content.
808 * @return {!Text} The new text node.
809 */
810goog.dom.createTextNode = function(content) {
811 return document.createTextNode(String(content));
812};
813
814
815/**
816 * Create a table.
817 * @param {number} rows The number of rows in the table. Must be >= 1.
818 * @param {number} columns The number of columns in the table. Must be >= 1.
819 * @param {boolean=} opt_fillWithNbsp If true, fills table entries with nsbps.
820 * @return {!Element} The created table.
821 */
822goog.dom.createTable = function(rows, columns, opt_fillWithNbsp) {
823 return goog.dom.createTable_(document, rows, columns, !!opt_fillWithNbsp);
824};
825
826
827/**
828 * Create a table.
829 * @param {!Document} doc Document object to use to create the table.
830 * @param {number} rows The number of rows in the table. Must be >= 1.
831 * @param {number} columns The number of columns in the table. Must be >= 1.
832 * @param {boolean} fillWithNbsp If true, fills table entries with nsbps.
833 * @return {!Element} The created table.
834 * @private
835 */
836goog.dom.createTable_ = function(doc, rows, columns, fillWithNbsp) {
837 var rowHtml = ['<tr>'];
838 for (var i = 0; i < columns; i++) {
839 rowHtml.push(fillWithNbsp ? '<td>&nbsp;</td>' : '<td></td>');
840 }
841 rowHtml.push('</tr>');
842 rowHtml = rowHtml.join('');
843 var totalHtml = ['<table>'];
844 for (i = 0; i < rows; i++) {
845 totalHtml.push(rowHtml);
846 }
847 totalHtml.push('</table>');
848
849 var elem = doc.createElement(goog.dom.TagName.DIV);
850 elem.innerHTML = totalHtml.join('');
851 return /** @type {!Element} */ (elem.removeChild(elem.firstChild));
852};
853
854
855/**
856 * Converts an HTML string into a document fragment. The string must be
857 * sanitized in order to avoid cross-site scripting. For example
858 * {@code goog.dom.htmlToDocumentFragment('&lt;img src=x onerror=alert(0)&gt;')}
859 * triggers an alert in all browsers, even if the returned document fragment
860 * is thrown away immediately.
861 *
862 * @param {string} htmlString The HTML string to convert.
863 * @return {!Node} The resulting document fragment.
864 */
865goog.dom.htmlToDocumentFragment = function(htmlString) {
866 return goog.dom.htmlToDocumentFragment_(document, htmlString);
867};
868
869
870/**
871 * Helper for {@code htmlToDocumentFragment}.
872 *
873 * @param {!Document} doc The document.
874 * @param {string} htmlString The HTML string to convert.
875 * @return {!Node} The resulting document fragment.
876 * @private
877 */
878goog.dom.htmlToDocumentFragment_ = function(doc, htmlString) {
879 var tempDiv = doc.createElement('div');
880 if (goog.dom.BrowserFeature.INNER_HTML_NEEDS_SCOPED_ELEMENT) {
881 tempDiv.innerHTML = '<br>' + htmlString;
882 tempDiv.removeChild(tempDiv.firstChild);
883 } else {
884 tempDiv.innerHTML = htmlString;
885 }
886 if (tempDiv.childNodes.length == 1) {
887 return /** @type {!Node} */ (tempDiv.removeChild(tempDiv.firstChild));
888 } else {
889 var fragment = doc.createDocumentFragment();
890 while (tempDiv.firstChild) {
891 fragment.appendChild(tempDiv.firstChild);
892 }
893 return fragment;
894 }
895};
896
897
898/**
899 * Returns true if the browser is in "CSS1-compatible" (standards-compliant)
900 * mode, false otherwise.
901 * @return {boolean} True if in CSS1-compatible mode.
902 */
903goog.dom.isCss1CompatMode = function() {
904 return goog.dom.isCss1CompatMode_(document);
905};
906
907
908/**
909 * Returns true if the browser is in "CSS1-compatible" (standards-compliant)
910 * mode, false otherwise.
911 * @param {!Document} doc The document to check.
912 * @return {boolean} True if in CSS1-compatible mode.
913 * @private
914 */
915goog.dom.isCss1CompatMode_ = function(doc) {
916 if (goog.dom.COMPAT_MODE_KNOWN_) {
917 return goog.dom.ASSUME_STANDARDS_MODE;
918 }
919
920 return doc.compatMode == 'CSS1Compat';
921};
922
923
924/**
925 * Determines if the given node can contain children, intended to be used for
926 * HTML generation.
927 *
928 * IE natively supports node.canHaveChildren but has inconsistent behavior.
929 * Prior to IE8 the base tag allows children and in IE9 all nodes return true
930 * for canHaveChildren.
931 *
932 * In practice all non-IE browsers allow you to add children to any node, but
933 * the behavior is inconsistent:
934 *
935 * <pre>
936 * var a = document.createElement('br');
937 * a.appendChild(document.createTextNode('foo'));
938 * a.appendChild(document.createTextNode('bar'));
939 * console.log(a.childNodes.length); // 2
940 * console.log(a.innerHTML); // Chrome: "", IE9: "foobar", FF3.5: "foobar"
941 * </pre>
942 *
943 * For more information, see:
944 * http://dev.w3.org/html5/markup/syntax.html#syntax-elements
945 *
946 * TODO(user): Rename shouldAllowChildren() ?
947 *
948 * @param {Node} node The node to check.
949 * @return {boolean} Whether the node can contain children.
950 */
951goog.dom.canHaveChildren = function(node) {
952 if (node.nodeType != goog.dom.NodeType.ELEMENT) {
953 return false;
954 }
955 switch (node.tagName) {
956 case goog.dom.TagName.APPLET:
957 case goog.dom.TagName.AREA:
958 case goog.dom.TagName.BASE:
959 case goog.dom.TagName.BR:
960 case goog.dom.TagName.COL:
961 case goog.dom.TagName.COMMAND:
962 case goog.dom.TagName.EMBED:
963 case goog.dom.TagName.FRAME:
964 case goog.dom.TagName.HR:
965 case goog.dom.TagName.IMG:
966 case goog.dom.TagName.INPUT:
967 case goog.dom.TagName.IFRAME:
968 case goog.dom.TagName.ISINDEX:
969 case goog.dom.TagName.KEYGEN:
970 case goog.dom.TagName.LINK:
971 case goog.dom.TagName.NOFRAMES:
972 case goog.dom.TagName.NOSCRIPT:
973 case goog.dom.TagName.META:
974 case goog.dom.TagName.OBJECT:
975 case goog.dom.TagName.PARAM:
976 case goog.dom.TagName.SCRIPT:
977 case goog.dom.TagName.SOURCE:
978 case goog.dom.TagName.STYLE:
979 case goog.dom.TagName.TRACK:
980 case goog.dom.TagName.WBR:
981 return false;
982 }
983 return true;
984};
985
986
987/**
988 * Appends a child to a node.
989 * @param {Node} parent Parent.
990 * @param {Node} child Child.
991 */
992goog.dom.appendChild = function(parent, child) {
993 parent.appendChild(child);
994};
995
996
997/**
998 * Appends a node with text or other nodes.
999 * @param {!Node} parent The node to append nodes to.
1000 * @param {...goog.dom.Appendable} var_args The things to append to the node.
1001 * If this is a Node it is appended as is.
1002 * If this is a string then a text node is appended.
1003 * If this is an array like object then fields 0 to length - 1 are appended.
1004 */
1005goog.dom.append = function(parent, var_args) {
1006 goog.dom.append_(goog.dom.getOwnerDocument(parent), parent, arguments, 1);
1007};
1008
1009
1010/**
1011 * Removes all the child nodes on a DOM node.
1012 * @param {Node} node Node to remove children from.
1013 */
1014goog.dom.removeChildren = function(node) {
1015 // Note: Iterations over live collections can be slow, this is the fastest
1016 // we could find. The double parenthesis are used to prevent JsCompiler and
1017 // strict warnings.
1018 var child;
1019 while ((child = node.firstChild)) {
1020 node.removeChild(child);
1021 }
1022};
1023
1024
1025/**
1026 * Inserts a new node before an existing reference node (i.e. as the previous
1027 * sibling). If the reference node has no parent, then does nothing.
1028 * @param {Node} newNode Node to insert.
1029 * @param {Node} refNode Reference node to insert before.
1030 */
1031goog.dom.insertSiblingBefore = function(newNode, refNode) {
1032 if (refNode.parentNode) {
1033 refNode.parentNode.insertBefore(newNode, refNode);
1034 }
1035};
1036
1037
1038/**
1039 * Inserts a new node after an existing reference node (i.e. as the next
1040 * sibling). If the reference node has no parent, then does nothing.
1041 * @param {Node} newNode Node to insert.
1042 * @param {Node} refNode Reference node to insert after.
1043 */
1044goog.dom.insertSiblingAfter = function(newNode, refNode) {
1045 if (refNode.parentNode) {
1046 refNode.parentNode.insertBefore(newNode, refNode.nextSibling);
1047 }
1048};
1049
1050
1051/**
1052 * Insert a child at a given index. If index is larger than the number of child
1053 * nodes that the parent currently has, the node is inserted as the last child
1054 * node.
1055 * @param {Element} parent The element into which to insert the child.
1056 * @param {Node} child The element to insert.
1057 * @param {number} index The index at which to insert the new child node. Must
1058 * not be negative.
1059 */
1060goog.dom.insertChildAt = function(parent, child, index) {
1061 // Note that if the second argument is null, insertBefore
1062 // will append the child at the end of the list of children.
1063 parent.insertBefore(child, parent.childNodes[index] || null);
1064};
1065
1066
1067/**
1068 * Removes a node from its parent.
1069 * @param {Node} node The node to remove.
1070 * @return {Node} The node removed if removed; else, null.
1071 */
1072goog.dom.removeNode = function(node) {
1073 return node && node.parentNode ? node.parentNode.removeChild(node) : null;
1074};
1075
1076
1077/**
1078 * Replaces a node in the DOM tree. Will do nothing if {@code oldNode} has no
1079 * parent.
1080 * @param {Node} newNode Node to insert.
1081 * @param {Node} oldNode Node to replace.
1082 */
1083goog.dom.replaceNode = function(newNode, oldNode) {
1084 var parent = oldNode.parentNode;
1085 if (parent) {
1086 parent.replaceChild(newNode, oldNode);
1087 }
1088};
1089
1090
1091/**
1092 * Flattens an element. That is, removes it and replace it with its children.
1093 * Does nothing if the element is not in the document.
1094 * @param {Element} element The element to flatten.
1095 * @return {Element|undefined} The original element, detached from the document
1096 * tree, sans children; or undefined, if the element was not in the document
1097 * to begin with.
1098 */
1099goog.dom.flattenElement = function(element) {
1100 var child, parent = element.parentNode;
1101 if (parent && parent.nodeType != goog.dom.NodeType.DOCUMENT_FRAGMENT) {
1102 // Use IE DOM method (supported by Opera too) if available
1103 if (element.removeNode) {
1104 return /** @type {Element} */ (element.removeNode(false));
1105 } else {
1106 // Move all children of the original node up one level.
1107 while ((child = element.firstChild)) {
1108 parent.insertBefore(child, element);
1109 }
1110
1111 // Detach the original element.
1112 return /** @type {Element} */ (goog.dom.removeNode(element));
1113 }
1114 }
1115};
1116
1117
1118/**
1119 * Returns an array containing just the element children of the given element.
1120 * @param {Element} element The element whose element children we want.
1121 * @return {!(Array|NodeList)} An array or array-like list of just the element
1122 * children of the given element.
1123 */
1124goog.dom.getChildren = function(element) {
1125 // We check if the children attribute is supported for child elements
1126 // since IE8 misuses the attribute by also including comments.
1127 if (goog.dom.BrowserFeature.CAN_USE_CHILDREN_ATTRIBUTE &&
1128 element.children != undefined) {
1129 return element.children;
1130 }
1131 // Fall back to manually filtering the element's child nodes.
1132 return goog.array.filter(element.childNodes, function(node) {
1133 return node.nodeType == goog.dom.NodeType.ELEMENT;
1134 });
1135};
1136
1137
1138/**
1139 * Returns the first child node that is an element.
1140 * @param {Node} node The node to get the first child element of.
1141 * @return {Element} The first child node of {@code node} that is an element.
1142 */
1143goog.dom.getFirstElementChild = function(node) {
1144 if (node.firstElementChild != undefined) {
1145 return /** @type {!Element} */(node).firstElementChild;
1146 }
1147 return goog.dom.getNextElementNode_(node.firstChild, true);
1148};
1149
1150
1151/**
1152 * Returns the last child node that is an element.
1153 * @param {Node} node The node to get the last child element of.
1154 * @return {Element} The last child node of {@code node} that is an element.
1155 */
1156goog.dom.getLastElementChild = function(node) {
1157 if (node.lastElementChild != undefined) {
1158 return /** @type {!Element} */(node).lastElementChild;
1159 }
1160 return goog.dom.getNextElementNode_(node.lastChild, false);
1161};
1162
1163
1164/**
1165 * Returns the first next sibling that is an element.
1166 * @param {Node} node The node to get the next sibling element of.
1167 * @return {Element} The next sibling of {@code node} that is an element.
1168 */
1169goog.dom.getNextElementSibling = function(node) {
1170 if (node.nextElementSibling != undefined) {
1171 return /** @type {!Element} */(node).nextElementSibling;
1172 }
1173 return goog.dom.getNextElementNode_(node.nextSibling, true);
1174};
1175
1176
1177/**
1178 * Returns the first previous sibling that is an element.
1179 * @param {Node} node The node to get the previous sibling element of.
1180 * @return {Element} The first previous sibling of {@code node} that is
1181 * an element.
1182 */
1183goog.dom.getPreviousElementSibling = function(node) {
1184 if (node.previousElementSibling != undefined) {
1185 return /** @type {!Element} */(node).previousElementSibling;
1186 }
1187 return goog.dom.getNextElementNode_(node.previousSibling, false);
1188};
1189
1190
1191/**
1192 * Returns the first node that is an element in the specified direction,
1193 * starting with {@code node}.
1194 * @param {Node} node The node to get the next element from.
1195 * @param {boolean} forward Whether to look forwards or backwards.
1196 * @return {Element} The first element.
1197 * @private
1198 */
1199goog.dom.getNextElementNode_ = function(node, forward) {
1200 while (node && node.nodeType != goog.dom.NodeType.ELEMENT) {
1201 node = forward ? node.nextSibling : node.previousSibling;
1202 }
1203
1204 return /** @type {Element} */ (node);
1205};
1206
1207
1208/**
1209 * Returns the next node in source order from the given node.
1210 * @param {Node} node The node.
1211 * @return {Node} The next node in the DOM tree, or null if this was the last
1212 * node.
1213 */
1214goog.dom.getNextNode = function(node) {
1215 if (!node) {
1216 return null;
1217 }
1218
1219 if (node.firstChild) {
1220 return node.firstChild;
1221 }
1222
1223 while (node && !node.nextSibling) {
1224 node = node.parentNode;
1225 }
1226
1227 return node ? node.nextSibling : null;
1228};
1229
1230
1231/**
1232 * Returns the previous node in source order from the given node.
1233 * @param {Node} node The node.
1234 * @return {Node} The previous node in the DOM tree, or null if this was the
1235 * first node.
1236 */
1237goog.dom.getPreviousNode = function(node) {
1238 if (!node) {
1239 return null;
1240 }
1241
1242 if (!node.previousSibling) {
1243 return node.parentNode;
1244 }
1245
1246 node = node.previousSibling;
1247 while (node && node.lastChild) {
1248 node = node.lastChild;
1249 }
1250
1251 return node;
1252};
1253
1254
1255/**
1256 * Whether the object looks like a DOM node.
1257 * @param {?} obj The object being tested for node likeness.
1258 * @return {boolean} Whether the object looks like a DOM node.
1259 */
1260goog.dom.isNodeLike = function(obj) {
1261 return goog.isObject(obj) && obj.nodeType > 0;
1262};
1263
1264
1265/**
1266 * Whether the object looks like an Element.
1267 * @param {?} obj The object being tested for Element likeness.
1268 * @return {boolean} Whether the object looks like an Element.
1269 */
1270goog.dom.isElement = function(obj) {
1271 return goog.isObject(obj) && obj.nodeType == goog.dom.NodeType.ELEMENT;
1272};
1273
1274
1275/**
1276 * Returns true if the specified value is a Window object. This includes the
1277 * global window for HTML pages, and iframe windows.
1278 * @param {?} obj Variable to test.
1279 * @return {boolean} Whether the variable is a window.
1280 */
1281goog.dom.isWindow = function(obj) {
1282 return goog.isObject(obj) && obj['window'] == obj;
1283};
1284
1285
1286/**
1287 * Returns an element's parent, if it's an Element.
1288 * @param {Element} element The DOM element.
1289 * @return {Element} The parent, or null if not an Element.
1290 */
1291goog.dom.getParentElement = function(element) {
1292 var parent;
1293 if (goog.dom.BrowserFeature.CAN_USE_PARENT_ELEMENT_PROPERTY) {
1294 var isIe9 = goog.userAgent.IE &&
1295 goog.userAgent.isVersionOrHigher('9') &&
1296 !goog.userAgent.isVersionOrHigher('10');
1297 // SVG elements in IE9 can't use the parentElement property.
1298 // goog.global['SVGElement'] is not defined in IE9 quirks mode.
1299 if (!(isIe9 && goog.global['SVGElement'] &&
1300 element instanceof goog.global['SVGElement'])) {
1301 parent = element.parentElement;
1302 if (parent) {
1303 return parent;
1304 }
1305 }
1306 }
1307 parent = element.parentNode;
1308 return goog.dom.isElement(parent) ? /** @type {!Element} */ (parent) : null;
1309};
1310
1311
1312/**
1313 * Whether a node contains another node.
1314 * @param {Node} parent The node that should contain the other node.
1315 * @param {Node} descendant The node to test presence of.
1316 * @return {boolean} Whether the parent node contains the descendent node.
1317 */
1318goog.dom.contains = function(parent, descendant) {
1319 // We use browser specific methods for this if available since it is faster
1320 // that way.
1321
1322 // IE DOM
1323 if (parent.contains && descendant.nodeType == goog.dom.NodeType.ELEMENT) {
1324 return parent == descendant || parent.contains(descendant);
1325 }
1326
1327 // W3C DOM Level 3
1328 if (typeof parent.compareDocumentPosition != 'undefined') {
1329 return parent == descendant ||
1330 Boolean(parent.compareDocumentPosition(descendant) & 16);
1331 }
1332
1333 // W3C DOM Level 1
1334 while (descendant && parent != descendant) {
1335 descendant = descendant.parentNode;
1336 }
1337 return descendant == parent;
1338};
1339
1340
1341/**
1342 * Compares the document order of two nodes, returning 0 if they are the same
1343 * node, a negative number if node1 is before node2, and a positive number if
1344 * node2 is before node1. Note that we compare the order the tags appear in the
1345 * document so in the tree <b><i>text</i></b> the B node is considered to be
1346 * before the I node.
1347 *
1348 * @param {Node} node1 The first node to compare.
1349 * @param {Node} node2 The second node to compare.
1350 * @return {number} 0 if the nodes are the same node, a negative number if node1
1351 * is before node2, and a positive number if node2 is before node1.
1352 */
1353goog.dom.compareNodeOrder = function(node1, node2) {
1354 // Fall out quickly for equality.
1355 if (node1 == node2) {
1356 return 0;
1357 }
1358
1359 // Use compareDocumentPosition where available
1360 if (node1.compareDocumentPosition) {
1361 // 4 is the bitmask for FOLLOWS.
1362 return node1.compareDocumentPosition(node2) & 2 ? 1 : -1;
1363 }
1364
1365 // Special case for document nodes on IE 7 and 8.
1366 if (goog.userAgent.IE && !goog.userAgent.isDocumentModeOrHigher(9)) {
1367 if (node1.nodeType == goog.dom.NodeType.DOCUMENT) {
1368 return -1;
1369 }
1370 if (node2.nodeType == goog.dom.NodeType.DOCUMENT) {
1371 return 1;
1372 }
1373 }
1374
1375 // Process in IE using sourceIndex - we check to see if the first node has
1376 // a source index or if its parent has one.
1377 if ('sourceIndex' in node1 ||
1378 (node1.parentNode && 'sourceIndex' in node1.parentNode)) {
1379 var isElement1 = node1.nodeType == goog.dom.NodeType.ELEMENT;
1380 var isElement2 = node2.nodeType == goog.dom.NodeType.ELEMENT;
1381
1382 if (isElement1 && isElement2) {
1383 return node1.sourceIndex - node2.sourceIndex;
1384 } else {
1385 var parent1 = node1.parentNode;
1386 var parent2 = node2.parentNode;
1387
1388 if (parent1 == parent2) {
1389 return goog.dom.compareSiblingOrder_(node1, node2);
1390 }
1391
1392 if (!isElement1 && goog.dom.contains(parent1, node2)) {
1393 return -1 * goog.dom.compareParentsDescendantNodeIe_(node1, node2);
1394 }
1395
1396
1397 if (!isElement2 && goog.dom.contains(parent2, node1)) {
1398 return goog.dom.compareParentsDescendantNodeIe_(node2, node1);
1399 }
1400
1401 return (isElement1 ? node1.sourceIndex : parent1.sourceIndex) -
1402 (isElement2 ? node2.sourceIndex : parent2.sourceIndex);
1403 }
1404 }
1405
1406 // For Safari, we compare ranges.
1407 var doc = goog.dom.getOwnerDocument(node1);
1408
1409 var range1, range2;
1410 range1 = doc.createRange();
1411 range1.selectNode(node1);
1412 range1.collapse(true);
1413
1414 range2 = doc.createRange();
1415 range2.selectNode(node2);
1416 range2.collapse(true);
1417
1418 return range1.compareBoundaryPoints(goog.global['Range'].START_TO_END,
1419 range2);
1420};
1421
1422
1423/**
1424 * Utility function to compare the position of two nodes, when
1425 * {@code textNode}'s parent is an ancestor of {@code node}. If this entry
1426 * condition is not met, this function will attempt to reference a null object.
1427 * @param {!Node} textNode The textNode to compare.
1428 * @param {Node} node The node to compare.
1429 * @return {number} -1 if node is before textNode, +1 otherwise.
1430 * @private
1431 */
1432goog.dom.compareParentsDescendantNodeIe_ = function(textNode, node) {
1433 var parent = textNode.parentNode;
1434 if (parent == node) {
1435 // If textNode is a child of node, then node comes first.
1436 return -1;
1437 }
1438 var sibling = node;
1439 while (sibling.parentNode != parent) {
1440 sibling = sibling.parentNode;
1441 }
1442 return goog.dom.compareSiblingOrder_(sibling, textNode);
1443};
1444
1445
1446/**
1447 * Utility function to compare the position of two nodes known to be non-equal
1448 * siblings.
1449 * @param {Node} node1 The first node to compare.
1450 * @param {!Node} node2 The second node to compare.
1451 * @return {number} -1 if node1 is before node2, +1 otherwise.
1452 * @private
1453 */
1454goog.dom.compareSiblingOrder_ = function(node1, node2) {
1455 var s = node2;
1456 while ((s = s.previousSibling)) {
1457 if (s == node1) {
1458 // We just found node1 before node2.
1459 return -1;
1460 }
1461 }
1462
1463 // Since we didn't find it, node1 must be after node2.
1464 return 1;
1465};
1466
1467
1468/**
1469 * Find the deepest common ancestor of the given nodes.
1470 * @param {...Node} var_args The nodes to find a common ancestor of.
1471 * @return {Node} The common ancestor of the nodes, or null if there is none.
1472 * null will only be returned if two or more of the nodes are from different
1473 * documents.
1474 */
1475goog.dom.findCommonAncestor = function(var_args) {
1476 var i, count = arguments.length;
1477 if (!count) {
1478 return null;
1479 } else if (count == 1) {
1480 return arguments[0];
1481 }
1482
1483 var paths = [];
1484 var minLength = Infinity;
1485 for (i = 0; i < count; i++) {
1486 // Compute the list of ancestors.
1487 var ancestors = [];
1488 var node = arguments[i];
1489 while (node) {
1490 ancestors.unshift(node);
1491 node = node.parentNode;
1492 }
1493
1494 // Save the list for comparison.
1495 paths.push(ancestors);
1496 minLength = Math.min(minLength, ancestors.length);
1497 }
1498 var output = null;
1499 for (i = 0; i < minLength; i++) {
1500 var first = paths[0][i];
1501 for (var j = 1; j < count; j++) {
1502 if (first != paths[j][i]) {
1503 return output;
1504 }
1505 }
1506 output = first;
1507 }
1508 return output;
1509};
1510
1511
1512/**
1513 * Returns the owner document for a node.
1514 * @param {Node|Window} node The node to get the document for.
1515 * @return {!Document} The document owning the node.
1516 */
1517goog.dom.getOwnerDocument = function(node) {
1518 // TODO(nnaze): Update param signature to be non-nullable.
1519 goog.asserts.assert(node, 'Node cannot be null or undefined.');
1520 return /** @type {!Document} */ (
1521 node.nodeType == goog.dom.NodeType.DOCUMENT ? node :
1522 node.ownerDocument || node.document);
1523};
1524
1525
1526/**
1527 * Cross-browser function for getting the document element of a frame or iframe.
1528 * @param {Element} frame Frame element.
1529 * @return {!Document} The frame content document.
1530 */
1531goog.dom.getFrameContentDocument = function(frame) {
1532 var doc = frame.contentDocument || frame.contentWindow.document;
1533 return doc;
1534};
1535
1536
1537/**
1538 * Cross-browser function for getting the window of a frame or iframe.
1539 * @param {Element} frame Frame element.
1540 * @return {Window} The window associated with the given frame.
1541 */
1542goog.dom.getFrameContentWindow = function(frame) {
1543 return frame.contentWindow ||
1544 goog.dom.getWindow(goog.dom.getFrameContentDocument(frame));
1545};
1546
1547
1548/**
1549 * Sets the text content of a node, with cross-browser support.
1550 * @param {Node} node The node to change the text content of.
1551 * @param {string|number} text The value that should replace the node's content.
1552 */
1553goog.dom.setTextContent = function(node, text) {
1554 goog.asserts.assert(node != null,
1555 'goog.dom.setTextContent expects a non-null value for node');
1556
1557 if ('textContent' in node) {
1558 node.textContent = text;
1559 } else if (node.nodeType == goog.dom.NodeType.TEXT) {
1560 node.data = text;
1561 } else if (node.firstChild &&
1562 node.firstChild.nodeType == goog.dom.NodeType.TEXT) {
1563 // If the first child is a text node we just change its data and remove the
1564 // rest of the children.
1565 while (node.lastChild != node.firstChild) {
1566 node.removeChild(node.lastChild);
1567 }
1568 node.firstChild.data = text;
1569 } else {
1570 goog.dom.removeChildren(node);
1571 var doc = goog.dom.getOwnerDocument(node);
1572 node.appendChild(doc.createTextNode(String(text)));
1573 }
1574};
1575
1576
1577/**
1578 * Gets the outerHTML of a node, which islike innerHTML, except that it
1579 * actually contains the HTML of the node itself.
1580 * @param {Element} element The element to get the HTML of.
1581 * @return {string} The outerHTML of the given element.
1582 */
1583goog.dom.getOuterHtml = function(element) {
1584 // IE, Opera and WebKit all have outerHTML.
1585 if ('outerHTML' in element) {
1586 return element.outerHTML;
1587 } else {
1588 var doc = goog.dom.getOwnerDocument(element);
1589 var div = doc.createElement('div');
1590 div.appendChild(element.cloneNode(true));
1591 return div.innerHTML;
1592 }
1593};
1594
1595
1596/**
1597 * Finds the first descendant node that matches the filter function, using
1598 * a depth first search. This function offers the most general purpose way
1599 * of finding a matching element. You may also wish to consider
1600 * {@code goog.dom.query} which can express many matching criteria using
1601 * CSS selector expressions. These expressions often result in a more
1602 * compact representation of the desired result.
1603 * @see goog.dom.query
1604 *
1605 * @param {Node} root The root of the tree to search.
1606 * @param {function(Node) : boolean} p The filter function.
1607 * @return {Node|undefined} The found node or undefined if none is found.
1608 */
1609goog.dom.findNode = function(root, p) {
1610 var rv = [];
1611 var found = goog.dom.findNodes_(root, p, rv, true);
1612 return found ? rv[0] : undefined;
1613};
1614
1615
1616/**
1617 * Finds all the descendant nodes that match the filter function, using a
1618 * a depth first search. This function offers the most general-purpose way
1619 * of finding a set of matching elements. You may also wish to consider
1620 * {@code goog.dom.query} which can express many matching criteria using
1621 * CSS selector expressions. These expressions often result in a more
1622 * compact representation of the desired result.
1623
1624 * @param {Node} root The root of the tree to search.
1625 * @param {function(Node) : boolean} p The filter function.
1626 * @return {!Array<!Node>} The found nodes or an empty array if none are found.
1627 */
1628goog.dom.findNodes = function(root, p) {
1629 var rv = [];
1630 goog.dom.findNodes_(root, p, rv, false);
1631 return rv;
1632};
1633
1634
1635/**
1636 * Finds the first or all the descendant nodes that match the filter function,
1637 * using a depth first search.
1638 * @param {Node} root The root of the tree to search.
1639 * @param {function(Node) : boolean} p The filter function.
1640 * @param {!Array<!Node>} rv The found nodes are added to this array.
1641 * @param {boolean} findOne If true we exit after the first found node.
1642 * @return {boolean} Whether the search is complete or not. True in case findOne
1643 * is true and the node is found. False otherwise.
1644 * @private
1645 */
1646goog.dom.findNodes_ = function(root, p, rv, findOne) {
1647 if (root != null) {
1648 var child = root.firstChild;
1649 while (child) {
1650 if (p(child)) {
1651 rv.push(child);
1652 if (findOne) {
1653 return true;
1654 }
1655 }
1656 if (goog.dom.findNodes_(child, p, rv, findOne)) {
1657 return true;
1658 }
1659 child = child.nextSibling;
1660 }
1661 }
1662 return false;
1663};
1664
1665
1666/**
1667 * Map of tags whose content to ignore when calculating text length.
1668 * @private {!Object<string, number>}
1669 * @const
1670 */
1671goog.dom.TAGS_TO_IGNORE_ = {
1672 'SCRIPT': 1,
1673 'STYLE': 1,
1674 'HEAD': 1,
1675 'IFRAME': 1,
1676 'OBJECT': 1
1677};
1678
1679
1680/**
1681 * Map of tags which have predefined values with regard to whitespace.
1682 * @private {!Object<string, string>}
1683 * @const
1684 */
1685goog.dom.PREDEFINED_TAG_VALUES_ = {'IMG': ' ', 'BR': '\n'};
1686
1687
1688/**
1689 * Returns true if the element has a tab index that allows it to receive
1690 * keyboard focus (tabIndex >= 0), false otherwise. Note that some elements
1691 * natively support keyboard focus, even if they have no tab index.
1692 * @param {!Element} element Element to check.
1693 * @return {boolean} Whether the element has a tab index that allows keyboard
1694 * focus.
1695 * @see http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
1696 */
1697goog.dom.isFocusableTabIndex = function(element) {
1698 return goog.dom.hasSpecifiedTabIndex_(element) &&
1699 goog.dom.isTabIndexFocusable_(element);
1700};
1701
1702
1703/**
1704 * Enables or disables keyboard focus support on the element via its tab index.
1705 * Only elements for which {@link goog.dom.isFocusableTabIndex} returns true
1706 * (or elements that natively support keyboard focus, like form elements) can
1707 * receive keyboard focus. See http://go/tabindex for more info.
1708 * @param {Element} element Element whose tab index is to be changed.
1709 * @param {boolean} enable Whether to set or remove a tab index on the element
1710 * that supports keyboard focus.
1711 */
1712goog.dom.setFocusableTabIndex = function(element, enable) {
1713 if (enable) {
1714 element.tabIndex = 0;
1715 } else {
1716 // Set tabIndex to -1 first, then remove it. This is a workaround for
1717 // Safari (confirmed in version 4 on Windows). When removing the attribute
1718 // without setting it to -1 first, the element remains keyboard focusable
1719 // despite not having a tabIndex attribute anymore.
1720 element.tabIndex = -1;
1721 element.removeAttribute('tabIndex'); // Must be camelCase!
1722 }
1723};
1724
1725
1726/**
1727 * Returns true if the element can be focused, i.e. it has a tab index that
1728 * allows it to receive keyboard focus (tabIndex >= 0), or it is an element
1729 * that natively supports keyboard focus.
1730 * @param {!Element} element Element to check.
1731 * @return {boolean} Whether the element allows keyboard focus.
1732 */
1733goog.dom.isFocusable = function(element) {
1734 var focusable;
1735 // Some elements can have unspecified tab index and still receive focus.
1736 if (goog.dom.nativelySupportsFocus_(element)) {
1737 // Make sure the element is not disabled ...
1738 focusable = !element.disabled &&
1739 // ... and if a tab index is specified, it allows focus.
1740 (!goog.dom.hasSpecifiedTabIndex_(element) ||
1741 goog.dom.isTabIndexFocusable_(element));
1742 } else {
1743 focusable = goog.dom.isFocusableTabIndex(element);
1744 }
1745
1746 // IE requires elements to be visible in order to focus them.
1747 return focusable && goog.userAgent.IE ?
1748 goog.dom.hasNonZeroBoundingRect_(element) : focusable;
1749};
1750
1751
1752/**
1753 * Returns true if the element has a specified tab index.
1754 * @param {!Element} element Element to check.
1755 * @return {boolean} Whether the element has a specified tab index.
1756 * @private
1757 */
1758goog.dom.hasSpecifiedTabIndex_ = function(element) {
1759 // IE returns 0 for an unset tabIndex, so we must use getAttributeNode(),
1760 // which returns an object with a 'specified' property if tabIndex is
1761 // specified. This works on other browsers, too.
1762 var attrNode = element.getAttributeNode('tabindex'); // Must be lowercase!
1763 return goog.isDefAndNotNull(attrNode) && attrNode.specified;
1764};
1765
1766
1767/**
1768 * Returns true if the element's tab index allows the element to be focused.
1769 * @param {!Element} element Element to check.
1770 * @return {boolean} Whether the element's tab index allows focus.
1771 * @private
1772 */
1773goog.dom.isTabIndexFocusable_ = function(element) {
1774 var index = element.tabIndex;
1775 // NOTE: IE9 puts tabIndex in 16-bit int, e.g. -2 is 65534.
1776 return goog.isNumber(index) && index >= 0 && index < 32768;
1777};
1778
1779
1780/**
1781 * Returns true if the element is focusable even when tabIndex is not set.
1782 * @param {!Element} element Element to check.
1783 * @return {boolean} Whether the element natively supports focus.
1784 * @private
1785 */
1786goog.dom.nativelySupportsFocus_ = function(element) {
1787 return element.tagName == goog.dom.TagName.A ||
1788 element.tagName == goog.dom.TagName.INPUT ||
1789 element.tagName == goog.dom.TagName.TEXTAREA ||
1790 element.tagName == goog.dom.TagName.SELECT ||
1791 element.tagName == goog.dom.TagName.BUTTON;
1792};
1793
1794
1795/**
1796 * Returns true if the element has a bounding rectangle that would be visible
1797 * (i.e. its width and height are greater than zero).
1798 * @param {!Element} element Element to check.
1799 * @return {boolean} Whether the element has a non-zero bounding rectangle.
1800 * @private
1801 */
1802goog.dom.hasNonZeroBoundingRect_ = function(element) {
1803 var rect = goog.isFunction(element['getBoundingClientRect']) ?
1804 element.getBoundingClientRect() :
1805 {'height': element.offsetHeight, 'width': element.offsetWidth};
1806 return goog.isDefAndNotNull(rect) && rect.height > 0 && rect.width > 0;
1807};
1808
1809
1810/**
1811 * Returns the text content of the current node, without markup and invisible
1812 * symbols. New lines are stripped and whitespace is collapsed,
1813 * such that each character would be visible.
1814 *
1815 * In browsers that support it, innerText is used. Other browsers attempt to
1816 * simulate it via node traversal. Line breaks are canonicalized in IE.
1817 *
1818 * @param {Node} node The node from which we are getting content.
1819 * @return {string} The text content.
1820 */
1821goog.dom.getTextContent = function(node) {
1822 var textContent;
1823 // Note(arv): IE9, Opera, and Safari 3 support innerText but they include
1824 // text nodes in script tags. So we revert to use a user agent test here.
1825 if (goog.dom.BrowserFeature.CAN_USE_INNER_TEXT && ('innerText' in node)) {
1826 textContent = goog.string.canonicalizeNewlines(node.innerText);
1827 // Unfortunately .innerText() returns text with &shy; symbols
1828 // We need to filter it out and then remove duplicate whitespaces
1829 } else {
1830 var buf = [];
1831 goog.dom.getTextContent_(node, buf, true);
1832 textContent = buf.join('');
1833 }
1834
1835 // Strip &shy; entities. goog.format.insertWordBreaks inserts them in Opera.
1836 textContent = textContent.replace(/ \xAD /g, ' ').replace(/\xAD/g, '');
1837 // Strip &#8203; entities. goog.format.insertWordBreaks inserts them in IE8.
1838 textContent = textContent.replace(/\u200B/g, '');
1839
1840 // Skip this replacement on old browsers with working innerText, which
1841 // automatically turns &nbsp; into ' ' and / +/ into ' ' when reading
1842 // innerText.
1843 if (!goog.dom.BrowserFeature.CAN_USE_INNER_TEXT) {
1844 textContent = textContent.replace(/ +/g, ' ');
1845 }
1846 if (textContent != ' ') {
1847 textContent = textContent.replace(/^\s*/, '');
1848 }
1849
1850 return textContent;
1851};
1852
1853
1854/**
1855 * Returns the text content of the current node, without markup.
1856 *
1857 * Unlike {@code getTextContent} this method does not collapse whitespaces
1858 * or normalize lines breaks.
1859 *
1860 * @param {Node} node The node from which we are getting content.
1861 * @return {string} The raw text content.
1862 */
1863goog.dom.getRawTextContent = function(node) {
1864 var buf = [];
1865 goog.dom.getTextContent_(node, buf, false);
1866
1867 return buf.join('');
1868};
1869
1870
1871/**
1872 * Recursive support function for text content retrieval.
1873 *
1874 * @param {Node} node The node from which we are getting content.
1875 * @param {Array<string>} buf string buffer.
1876 * @param {boolean} normalizeWhitespace Whether to normalize whitespace.
1877 * @private
1878 */
1879goog.dom.getTextContent_ = function(node, buf, normalizeWhitespace) {
1880 if (node.nodeName in goog.dom.TAGS_TO_IGNORE_) {
1881 // ignore certain tags
1882 } else if (node.nodeType == goog.dom.NodeType.TEXT) {
1883 if (normalizeWhitespace) {
1884 buf.push(String(node.nodeValue).replace(/(\r\n|\r|\n)/g, ''));
1885 } else {
1886 buf.push(node.nodeValue);
1887 }
1888 } else if (node.nodeName in goog.dom.PREDEFINED_TAG_VALUES_) {
1889 buf.push(goog.dom.PREDEFINED_TAG_VALUES_[node.nodeName]);
1890 } else {
1891 var child = node.firstChild;
1892 while (child) {
1893 goog.dom.getTextContent_(child, buf, normalizeWhitespace);
1894 child = child.nextSibling;
1895 }
1896 }
1897};
1898
1899
1900/**
1901 * Returns the text length of the text contained in a node, without markup. This
1902 * is equivalent to the selection length if the node was selected, or the number
1903 * of cursor movements to traverse the node. Images & BRs take one space. New
1904 * lines are ignored.
1905 *
1906 * @param {Node} node The node whose text content length is being calculated.
1907 * @return {number} The length of {@code node}'s text content.
1908 */
1909goog.dom.getNodeTextLength = function(node) {
1910 return goog.dom.getTextContent(node).length;
1911};
1912
1913
1914/**
1915 * Returns the text offset of a node relative to one of its ancestors. The text
1916 * length is the same as the length calculated by goog.dom.getNodeTextLength.
1917 *
1918 * @param {Node} node The node whose offset is being calculated.
1919 * @param {Node=} opt_offsetParent The node relative to which the offset will
1920 * be calculated. Defaults to the node's owner document's body.
1921 * @return {number} The text offset.
1922 */
1923goog.dom.getNodeTextOffset = function(node, opt_offsetParent) {
1924 var root = opt_offsetParent || goog.dom.getOwnerDocument(node).body;
1925 var buf = [];
1926 while (node && node != root) {
1927 var cur = node;
1928 while ((cur = cur.previousSibling)) {
1929 buf.unshift(goog.dom.getTextContent(cur));
1930 }
1931 node = node.parentNode;
1932 }
1933 // Trim left to deal with FF cases when there might be line breaks and empty
1934 // nodes at the front of the text
1935 return goog.string.trimLeft(buf.join('')).replace(/ +/g, ' ').length;
1936};
1937
1938
1939/**
1940 * Returns the node at a given offset in a parent node. If an object is
1941 * provided for the optional third parameter, the node and the remainder of the
1942 * offset will stored as properties of this object.
1943 * @param {Node} parent The parent node.
1944 * @param {number} offset The offset into the parent node.
1945 * @param {Object=} opt_result Object to be used to store the return value. The
1946 * return value will be stored in the form {node: Node, remainder: number}
1947 * if this object is provided.
1948 * @return {Node} The node at the given offset.
1949 */
1950goog.dom.getNodeAtOffset = function(parent, offset, opt_result) {
1951 var stack = [parent], pos = 0, cur = null;
1952 while (stack.length > 0 && pos < offset) {
1953 cur = stack.pop();
1954 if (cur.nodeName in goog.dom.TAGS_TO_IGNORE_) {
1955 // ignore certain tags
1956 } else if (cur.nodeType == goog.dom.NodeType.TEXT) {
1957 var text = cur.nodeValue.replace(/(\r\n|\r|\n)/g, '').replace(/ +/g, ' ');
1958 pos += text.length;
1959 } else if (cur.nodeName in goog.dom.PREDEFINED_TAG_VALUES_) {
1960 pos += goog.dom.PREDEFINED_TAG_VALUES_[cur.nodeName].length;
1961 } else {
1962 for (var i = cur.childNodes.length - 1; i >= 0; i--) {
1963 stack.push(cur.childNodes[i]);
1964 }
1965 }
1966 }
1967 if (goog.isObject(opt_result)) {
1968 opt_result.remainder = cur ? cur.nodeValue.length + offset - pos - 1 : 0;
1969 opt_result.node = cur;
1970 }
1971
1972 return cur;
1973};
1974
1975
1976/**
1977 * Returns true if the object is a {@code NodeList}. To qualify as a NodeList,
1978 * the object must have a numeric length property and an item function (which
1979 * has type 'string' on IE for some reason).
1980 * @param {Object} val Object to test.
1981 * @return {boolean} Whether the object is a NodeList.
1982 */
1983goog.dom.isNodeList = function(val) {
1984 // TODO(attila): Now the isNodeList is part of goog.dom we can use
1985 // goog.userAgent to make this simpler.
1986 // A NodeList must have a length property of type 'number' on all platforms.
1987 if (val && typeof val.length == 'number') {
1988 // A NodeList is an object everywhere except Safari, where it's a function.
1989 if (goog.isObject(val)) {
1990 // A NodeList must have an item function (on non-IE platforms) or an item
1991 // property of type 'string' (on IE).
1992 return typeof val.item == 'function' || typeof val.item == 'string';
1993 } else if (goog.isFunction(val)) {
1994 // On Safari, a NodeList is a function with an item property that is also
1995 // a function.
1996 return typeof val.item == 'function';
1997 }
1998 }
1999
2000 // Not a NodeList.
2001 return false;
2002};
2003
2004
2005/**
2006 * Walks up the DOM hierarchy returning the first ancestor that has the passed
2007 * tag name and/or class name. If the passed element matches the specified
2008 * criteria, the element itself is returned.
2009 * @param {Node} element The DOM node to start with.
2010 * @param {?(goog.dom.TagName|string)=} opt_tag The tag name to match (or
2011 * null/undefined to match only based on class name).
2012 * @param {?string=} opt_class The class name to match (or null/undefined to
2013 * match only based on tag name).
2014 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2015 * dom.
2016 * @return {Element} The first ancestor that matches the passed criteria, or
2017 * null if no match is found.
2018 */
2019goog.dom.getAncestorByTagNameAndClass = function(element, opt_tag, opt_class,
2020 opt_maxSearchSteps) {
2021 if (!opt_tag && !opt_class) {
2022 return null;
2023 }
2024 var tagName = opt_tag ? opt_tag.toUpperCase() : null;
2025 return /** @type {Element} */ (goog.dom.getAncestor(element,
2026 function(node) {
2027 return (!tagName || node.nodeName == tagName) &&
2028 (!opt_class || goog.isString(node.className) &&
2029 goog.array.contains(node.className.split(/\s+/), opt_class));
2030 }, true, opt_maxSearchSteps));
2031};
2032
2033
2034/**
2035 * Walks up the DOM hierarchy returning the first ancestor that has the passed
2036 * class name. If the passed element matches the specified criteria, the
2037 * element itself is returned.
2038 * @param {Node} element The DOM node to start with.
2039 * @param {string} className The class name to match.
2040 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2041 * dom.
2042 * @return {Element} The first ancestor that matches the passed criteria, or
2043 * null if none match.
2044 */
2045goog.dom.getAncestorByClass = function(element, className, opt_maxSearchSteps) {
2046 return goog.dom.getAncestorByTagNameAndClass(element, null, className,
2047 opt_maxSearchSteps);
2048};
2049
2050
2051/**
2052 * Walks up the DOM hierarchy returning the first ancestor that passes the
2053 * matcher function.
2054 * @param {Node} element The DOM node to start with.
2055 * @param {function(Node) : boolean} matcher A function that returns true if the
2056 * passed node matches the desired criteria.
2057 * @param {boolean=} opt_includeNode If true, the node itself is included in
2058 * the search (the first call to the matcher will pass startElement as
2059 * the node to test).
2060 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2061 * dom.
2062 * @return {Node} DOM node that matched the matcher, or null if there was
2063 * no match.
2064 */
2065goog.dom.getAncestor = function(
2066 element, matcher, opt_includeNode, opt_maxSearchSteps) {
2067 if (!opt_includeNode) {
2068 element = element.parentNode;
2069 }
2070 var ignoreSearchSteps = opt_maxSearchSteps == null;
2071 var steps = 0;
2072 while (element && (ignoreSearchSteps || steps <= opt_maxSearchSteps)) {
2073 if (matcher(element)) {
2074 return element;
2075 }
2076 element = element.parentNode;
2077 steps++;
2078 }
2079 // Reached the root of the DOM without a match
2080 return null;
2081};
2082
2083
2084/**
2085 * Determines the active element in the given document.
2086 * @param {Document} doc The document to look in.
2087 * @return {Element} The active element.
2088 */
2089goog.dom.getActiveElement = function(doc) {
2090 try {
2091 return doc && doc.activeElement;
2092 } catch (e) {
2093 // NOTE(nicksantos): Sometimes, evaluating document.activeElement in IE
2094 // throws an exception. I'm not 100% sure why, but I suspect it chokes
2095 // on document.activeElement if the activeElement has been recently
2096 // removed from the DOM by a JS operation.
2097 //
2098 // We assume that an exception here simply means
2099 // "there is no active element."
2100 }
2101
2102 return null;
2103};
2104
2105
2106/**
2107 * Gives the current devicePixelRatio.
2108 *
2109 * By default, this is the value of window.devicePixelRatio (which should be
2110 * preferred if present).
2111 *
2112 * If window.devicePixelRatio is not present, the ratio is calculated with
2113 * window.matchMedia, if present. Otherwise, gives 1.0.
2114 *
2115 * Some browsers (including Chrome) consider the browser zoom level in the pixel
2116 * ratio, so the value may change across multiple calls.
2117 *
2118 * @return {number} The number of actual pixels per virtual pixel.
2119 */
2120goog.dom.getPixelRatio = function() {
2121 var win = goog.dom.getWindow();
2122
2123 // devicePixelRatio does not work on Mobile firefox.
2124 // TODO(user): Enable this check on a known working mobile Gecko version.
2125 // Filed a bug: https://bugzilla.mozilla.org/show_bug.cgi?id=896804
2126 var isFirefoxMobile = goog.userAgent.GECKO && goog.userAgent.MOBILE;
2127
2128 if (goog.isDef(win.devicePixelRatio) && !isFirefoxMobile) {
2129 return win.devicePixelRatio;
2130 } else if (win.matchMedia) {
2131 return goog.dom.matchesPixelRatio_(.75) ||
2132 goog.dom.matchesPixelRatio_(1.5) ||
2133 goog.dom.matchesPixelRatio_(2) ||
2134 goog.dom.matchesPixelRatio_(3) || 1;
2135 }
2136 return 1;
2137};
2138
2139
2140/**
2141 * Calculates a mediaQuery to check if the current device supports the
2142 * given actual to virtual pixel ratio.
2143 * @param {number} pixelRatio The ratio of actual pixels to virtual pixels.
2144 * @return {number} pixelRatio if applicable, otherwise 0.
2145 * @private
2146 */
2147goog.dom.matchesPixelRatio_ = function(pixelRatio) {
2148 var win = goog.dom.getWindow();
2149 var query = ('(-webkit-min-device-pixel-ratio: ' + pixelRatio + '),' +
2150 '(min--moz-device-pixel-ratio: ' + pixelRatio + '),' +
2151 '(min-resolution: ' + pixelRatio + 'dppx)');
2152 return win.matchMedia(query).matches ? pixelRatio : 0;
2153};
2154
2155
2156
2157/**
2158 * Create an instance of a DOM helper with a new document object.
2159 * @param {Document=} opt_document Document object to associate with this
2160 * DOM helper.
2161 * @constructor
2162 */
2163goog.dom.DomHelper = function(opt_document) {
2164 /**
2165 * Reference to the document object to use
2166 * @type {!Document}
2167 * @private
2168 */
2169 this.document_ = opt_document || goog.global.document || document;
2170};
2171
2172
2173/**
2174 * Gets the dom helper object for the document where the element resides.
2175 * @param {Node=} opt_node If present, gets the DomHelper for this node.
2176 * @return {!goog.dom.DomHelper} The DomHelper.
2177 */
2178goog.dom.DomHelper.prototype.getDomHelper = goog.dom.getDomHelper;
2179
2180
2181/**
2182 * Sets the document object.
2183 * @param {!Document} document Document object.
2184 */
2185goog.dom.DomHelper.prototype.setDocument = function(document) {
2186 this.document_ = document;
2187};
2188
2189
2190/**
2191 * Gets the document object being used by the dom library.
2192 * @return {!Document} Document object.
2193 */
2194goog.dom.DomHelper.prototype.getDocument = function() {
2195 return this.document_;
2196};
2197
2198
2199/**
2200 * Alias for {@code getElementById}. If a DOM node is passed in then we just
2201 * return that.
2202 * @param {string|Element} element Element ID or a DOM node.
2203 * @return {Element} The element with the given ID, or the node passed in.
2204 */
2205goog.dom.DomHelper.prototype.getElement = function(element) {
2206 return goog.dom.getElementHelper_(this.document_, element);
2207};
2208
2209
2210/**
2211 * Gets an element by id, asserting that the element is found.
2212 *
2213 * This is used when an element is expected to exist, and should fail with
2214 * an assertion error if it does not (if assertions are enabled).
2215 *
2216 * @param {string} id Element ID.
2217 * @return {!Element} The element with the given ID, if it exists.
2218 */
2219goog.dom.DomHelper.prototype.getRequiredElement = function(id) {
2220 return goog.dom.getRequiredElementHelper_(this.document_, id);
2221};
2222
2223
2224/**
2225 * Alias for {@code getElement}.
2226 * @param {string|Element} element Element ID or a DOM node.
2227 * @return {Element} The element with the given ID, or the node passed in.
2228 * @deprecated Use {@link goog.dom.DomHelper.prototype.getElement} instead.
2229 */
2230goog.dom.DomHelper.prototype.$ = goog.dom.DomHelper.prototype.getElement;
2231
2232
2233/**
2234 * Looks up elements by both tag and class name, using browser native functions
2235 * ({@code querySelectorAll}, {@code getElementsByTagName} or
2236 * {@code getElementsByClassName}) where possible. The returned array is a live
2237 * NodeList or a static list depending on the code path taken.
2238 *
2239 * @see goog.dom.query
2240 *
2241 * @param {?string=} opt_tag Element tag name or * for all tags.
2242 * @param {?string=} opt_class Optional class name.
2243 * @param {(Document|Element)=} opt_el Optional element to look in.
2244 * @return { {length: number} } Array-like list of elements (only a length
2245 * property and numerical indices are guaranteed to exist).
2246 */
2247goog.dom.DomHelper.prototype.getElementsByTagNameAndClass = function(opt_tag,
2248 opt_class,
2249 opt_el) {
2250 return goog.dom.getElementsByTagNameAndClass_(this.document_, opt_tag,
2251 opt_class, opt_el);
2252};
2253
2254
2255/**
2256 * Returns an array of all the elements with the provided className.
2257 * @see {goog.dom.query}
2258 * @param {string} className the name of the class to look for.
2259 * @param {Element|Document=} opt_el Optional element to look in.
2260 * @return { {length: number} } The items found with the class name provided.
2261 */
2262goog.dom.DomHelper.prototype.getElementsByClass = function(className, opt_el) {
2263 var doc = opt_el || this.document_;
2264 return goog.dom.getElementsByClass(className, doc);
2265};
2266
2267
2268/**
2269 * Returns the first element we find matching the provided class name.
2270 * @see {goog.dom.query}
2271 * @param {string} className the name of the class to look for.
2272 * @param {(Element|Document)=} opt_el Optional element to look in.
2273 * @return {Element} The first item found with the class name provided.
2274 */
2275goog.dom.DomHelper.prototype.getElementByClass = function(className, opt_el) {
2276 var doc = opt_el || this.document_;
2277 return goog.dom.getElementByClass(className, doc);
2278};
2279
2280
2281/**
2282 * Ensures an element with the given className exists, and then returns the
2283 * first element with the provided className.
2284 * @see {goog.dom.query}
2285 * @param {string} className the name of the class to look for.
2286 * @param {(!Element|!Document)=} opt_root Optional element or document to look
2287 * in.
2288 * @return {!Element} The first item found with the class name provided.
2289 * @throws {goog.asserts.AssertionError} Thrown if no element is found.
2290 */
2291goog.dom.DomHelper.prototype.getRequiredElementByClass = function(className,
2292 opt_root) {
2293 var root = opt_root || this.document_;
2294 return goog.dom.getRequiredElementByClass(className, root);
2295};
2296
2297
2298/**
2299 * Alias for {@code getElementsByTagNameAndClass}.
2300 * @deprecated Use DomHelper getElementsByTagNameAndClass.
2301 * @see goog.dom.query
2302 *
2303 * @param {?string=} opt_tag Element tag name.
2304 * @param {?string=} opt_class Optional class name.
2305 * @param {Element=} opt_el Optional element to look in.
2306 * @return { {length: number} } Array-like list of elements (only a length
2307 * property and numerical indices are guaranteed to exist).
2308 */
2309goog.dom.DomHelper.prototype.$$ =
2310 goog.dom.DomHelper.prototype.getElementsByTagNameAndClass;
2311
2312
2313/**
2314 * Sets a number of properties on a node.
2315 * @param {Element} element DOM node to set properties on.
2316 * @param {Object} properties Hash of property:value pairs.
2317 */
2318goog.dom.DomHelper.prototype.setProperties = goog.dom.setProperties;
2319
2320
2321/**
2322 * Gets the dimensions of the viewport.
2323 * @param {Window=} opt_window Optional window element to test. Defaults to
2324 * the window of the Dom Helper.
2325 * @return {!goog.math.Size} Object with values 'width' and 'height'.
2326 */
2327goog.dom.DomHelper.prototype.getViewportSize = function(opt_window) {
2328 // TODO(arv): This should not take an argument. That breaks the rule of a
2329 // a DomHelper representing a single frame/window/document.
2330 return goog.dom.getViewportSize(opt_window || this.getWindow());
2331};
2332
2333
2334/**
2335 * Calculates the height of the document.
2336 *
2337 * @return {number} The height of the document.
2338 */
2339goog.dom.DomHelper.prototype.getDocumentHeight = function() {
2340 return goog.dom.getDocumentHeight_(this.getWindow());
2341};
2342
2343
2344/**
2345 * Typedef for use with goog.dom.createDom and goog.dom.append.
2346 * @typedef {Object|string|Array|NodeList}
2347 */
2348goog.dom.Appendable;
2349
2350
2351/**
2352 * Returns a dom node with a set of attributes. This function accepts varargs
2353 * for subsequent nodes to be added. Subsequent nodes will be added to the
2354 * first node as childNodes.
2355 *
2356 * So:
2357 * <code>createDom('div', null, createDom('p'), createDom('p'));</code>
2358 * would return a div with two child paragraphs
2359 *
2360 * An easy way to move all child nodes of an existing element to a new parent
2361 * element is:
2362 * <code>createDom('div', null, oldElement.childNodes);</code>
2363 * which will remove all child nodes from the old element and add them as
2364 * child nodes of the new DIV.
2365 *
2366 * @param {string} tagName Tag to create.
2367 * @param {Object|string=} opt_attributes If object, then a map of name-value
2368 * pairs for attributes. If a string, then this is the className of the new
2369 * element.
2370 * @param {...goog.dom.Appendable} var_args Further DOM nodes or
2371 * strings for text nodes. If one of the var_args is an array or
2372 * NodeList, its elements will be added as childNodes instead.
2373 * @return {!Element} Reference to a DOM node.
2374 */
2375goog.dom.DomHelper.prototype.createDom = function(tagName,
2376 opt_attributes,
2377 var_args) {
2378 return goog.dom.createDom_(this.document_, arguments);
2379};
2380
2381
2382/**
2383 * Alias for {@code createDom}.
2384 * @param {string} tagName Tag to create.
2385 * @param {(Object|string)=} opt_attributes If object, then a map of name-value
2386 * pairs for attributes. If a string, then this is the className of the new
2387 * element.
2388 * @param {...goog.dom.Appendable} var_args Further DOM nodes or strings for
2389 * text nodes. If one of the var_args is an array, its children will be
2390 * added as childNodes instead.
2391 * @return {!Element} Reference to a DOM node.
2392 * @deprecated Use {@link goog.dom.DomHelper.prototype.createDom} instead.
2393 */
2394goog.dom.DomHelper.prototype.$dom = goog.dom.DomHelper.prototype.createDom;
2395
2396
2397/**
2398 * Creates a new element.
2399 * @param {string} name Tag name.
2400 * @return {!Element} The new element.
2401 */
2402goog.dom.DomHelper.prototype.createElement = function(name) {
2403 return this.document_.createElement(name);
2404};
2405
2406
2407/**
2408 * Creates a new text node.
2409 * @param {number|string} content Content.
2410 * @return {!Text} The new text node.
2411 */
2412goog.dom.DomHelper.prototype.createTextNode = function(content) {
2413 return this.document_.createTextNode(String(content));
2414};
2415
2416
2417/**
2418 * Create a table.
2419 * @param {number} rows The number of rows in the table. Must be >= 1.
2420 * @param {number} columns The number of columns in the table. Must be >= 1.
2421 * @param {boolean=} opt_fillWithNbsp If true, fills table entries with nsbps.
2422 * @return {!Element} The created table.
2423 */
2424goog.dom.DomHelper.prototype.createTable = function(rows, columns,
2425 opt_fillWithNbsp) {
2426 return goog.dom.createTable_(this.document_, rows, columns,
2427 !!opt_fillWithNbsp);
2428};
2429
2430
2431/**
2432 * Converts an HTML string into a node or a document fragment. A single Node
2433 * is used if the {@code htmlString} only generates a single node. If the
2434 * {@code htmlString} generates multiple nodes then these are put inside a
2435 * {@code DocumentFragment}.
2436 *
2437 * @param {string} htmlString The HTML string to convert.
2438 * @return {!Node} The resulting node.
2439 */
2440goog.dom.DomHelper.prototype.htmlToDocumentFragment = function(htmlString) {
2441 return goog.dom.htmlToDocumentFragment_(this.document_, htmlString);
2442};
2443
2444
2445/**
2446 * Returns true if the browser is in "CSS1-compatible" (standards-compliant)
2447 * mode, false otherwise.
2448 * @return {boolean} True if in CSS1-compatible mode.
2449 */
2450goog.dom.DomHelper.prototype.isCss1CompatMode = function() {
2451 return goog.dom.isCss1CompatMode_(this.document_);
2452};
2453
2454
2455/**
2456 * Gets the window object associated with the document.
2457 * @return {!Window} The window associated with the given document.
2458 */
2459goog.dom.DomHelper.prototype.getWindow = function() {
2460 return goog.dom.getWindow_(this.document_);
2461};
2462
2463
2464/**
2465 * Gets the document scroll element.
2466 * @return {!Element} Scrolling element.
2467 */
2468goog.dom.DomHelper.prototype.getDocumentScrollElement = function() {
2469 return goog.dom.getDocumentScrollElement_(this.document_);
2470};
2471
2472
2473/**
2474 * Gets the document scroll distance as a coordinate object.
2475 * @return {!goog.math.Coordinate} Object with properties 'x' and 'y'.
2476 */
2477goog.dom.DomHelper.prototype.getDocumentScroll = function() {
2478 return goog.dom.getDocumentScroll_(this.document_);
2479};
2480
2481
2482/**
2483 * Determines the active element in the given document.
2484 * @param {Document=} opt_doc The document to look in.
2485 * @return {Element} The active element.
2486 */
2487goog.dom.DomHelper.prototype.getActiveElement = function(opt_doc) {
2488 return goog.dom.getActiveElement(opt_doc || this.document_);
2489};
2490
2491
2492/**
2493 * Appends a child to a node.
2494 * @param {Node} parent Parent.
2495 * @param {Node} child Child.
2496 */
2497goog.dom.DomHelper.prototype.appendChild = goog.dom.appendChild;
2498
2499
2500/**
2501 * Appends a node with text or other nodes.
2502 * @param {!Node} parent The node to append nodes to.
2503 * @param {...goog.dom.Appendable} var_args The things to append to the node.
2504 * If this is a Node it is appended as is.
2505 * If this is a string then a text node is appended.
2506 * If this is an array like object then fields 0 to length - 1 are appended.
2507 */
2508goog.dom.DomHelper.prototype.append = goog.dom.append;
2509
2510
2511/**
2512 * Determines if the given node can contain children, intended to be used for
2513 * HTML generation.
2514 *
2515 * @param {Node} node The node to check.
2516 * @return {boolean} Whether the node can contain children.
2517 */
2518goog.dom.DomHelper.prototype.canHaveChildren = goog.dom.canHaveChildren;
2519
2520
2521/**
2522 * Removes all the child nodes on a DOM node.
2523 * @param {Node} node Node to remove children from.
2524 */
2525goog.dom.DomHelper.prototype.removeChildren = goog.dom.removeChildren;
2526
2527
2528/**
2529 * Inserts a new node before an existing reference node (i.e., as the previous
2530 * sibling). If the reference node has no parent, then does nothing.
2531 * @param {Node} newNode Node to insert.
2532 * @param {Node} refNode Reference node to insert before.
2533 */
2534goog.dom.DomHelper.prototype.insertSiblingBefore = goog.dom.insertSiblingBefore;
2535
2536
2537/**
2538 * Inserts a new node after an existing reference node (i.e., as the next
2539 * sibling). If the reference node has no parent, then does nothing.
2540 * @param {Node} newNode Node to insert.
2541 * @param {Node} refNode Reference node to insert after.
2542 */
2543goog.dom.DomHelper.prototype.insertSiblingAfter = goog.dom.insertSiblingAfter;
2544
2545
2546/**
2547 * Insert a child at a given index. If index is larger than the number of child
2548 * nodes that the parent currently has, the node is inserted as the last child
2549 * node.
2550 * @param {Element} parent The element into which to insert the child.
2551 * @param {Node} child The element to insert.
2552 * @param {number} index The index at which to insert the new child node. Must
2553 * not be negative.
2554 */
2555goog.dom.DomHelper.prototype.insertChildAt = goog.dom.insertChildAt;
2556
2557
2558/**
2559 * Removes a node from its parent.
2560 * @param {Node} node The node to remove.
2561 * @return {Node} The node removed if removed; else, null.
2562 */
2563goog.dom.DomHelper.prototype.removeNode = goog.dom.removeNode;
2564
2565
2566/**
2567 * Replaces a node in the DOM tree. Will do nothing if {@code oldNode} has no
2568 * parent.
2569 * @param {Node} newNode Node to insert.
2570 * @param {Node} oldNode Node to replace.
2571 */
2572goog.dom.DomHelper.prototype.replaceNode = goog.dom.replaceNode;
2573
2574
2575/**
2576 * Flattens an element. That is, removes it and replace it with its children.
2577 * @param {Element} element The element to flatten.
2578 * @return {Element|undefined} The original element, detached from the document
2579 * tree, sans children, or undefined if the element was already not in the
2580 * document.
2581 */
2582goog.dom.DomHelper.prototype.flattenElement = goog.dom.flattenElement;
2583
2584
2585/**
2586 * Returns an array containing just the element children of the given element.
2587 * @param {Element} element The element whose element children we want.
2588 * @return {!(Array|NodeList)} An array or array-like list of just the element
2589 * children of the given element.
2590 */
2591goog.dom.DomHelper.prototype.getChildren = goog.dom.getChildren;
2592
2593
2594/**
2595 * Returns the first child node that is an element.
2596 * @param {Node} node The node to get the first child element of.
2597 * @return {Element} The first child node of {@code node} that is an element.
2598 */
2599goog.dom.DomHelper.prototype.getFirstElementChild =
2600 goog.dom.getFirstElementChild;
2601
2602
2603/**
2604 * Returns the last child node that is an element.
2605 * @param {Node} node The node to get the last child element of.
2606 * @return {Element} The last child node of {@code node} that is an element.
2607 */
2608goog.dom.DomHelper.prototype.getLastElementChild = goog.dom.getLastElementChild;
2609
2610
2611/**
2612 * Returns the first next sibling that is an element.
2613 * @param {Node} node The node to get the next sibling element of.
2614 * @return {Element} The next sibling of {@code node} that is an element.
2615 */
2616goog.dom.DomHelper.prototype.getNextElementSibling =
2617 goog.dom.getNextElementSibling;
2618
2619
2620/**
2621 * Returns the first previous sibling that is an element.
2622 * @param {Node} node The node to get the previous sibling element of.
2623 * @return {Element} The first previous sibling of {@code node} that is
2624 * an element.
2625 */
2626goog.dom.DomHelper.prototype.getPreviousElementSibling =
2627 goog.dom.getPreviousElementSibling;
2628
2629
2630/**
2631 * Returns the next node in source order from the given node.
2632 * @param {Node} node The node.
2633 * @return {Node} The next node in the DOM tree, or null if this was the last
2634 * node.
2635 */
2636goog.dom.DomHelper.prototype.getNextNode = goog.dom.getNextNode;
2637
2638
2639/**
2640 * Returns the previous node in source order from the given node.
2641 * @param {Node} node The node.
2642 * @return {Node} The previous node in the DOM tree, or null if this was the
2643 * first node.
2644 */
2645goog.dom.DomHelper.prototype.getPreviousNode = goog.dom.getPreviousNode;
2646
2647
2648/**
2649 * Whether the object looks like a DOM node.
2650 * @param {?} obj The object being tested for node likeness.
2651 * @return {boolean} Whether the object looks like a DOM node.
2652 */
2653goog.dom.DomHelper.prototype.isNodeLike = goog.dom.isNodeLike;
2654
2655
2656/**
2657 * Whether the object looks like an Element.
2658 * @param {?} obj The object being tested for Element likeness.
2659 * @return {boolean} Whether the object looks like an Element.
2660 */
2661goog.dom.DomHelper.prototype.isElement = goog.dom.isElement;
2662
2663
2664/**
2665 * Returns true if the specified value is a Window object. This includes the
2666 * global window for HTML pages, and iframe windows.
2667 * @param {?} obj Variable to test.
2668 * @return {boolean} Whether the variable is a window.
2669 */
2670goog.dom.DomHelper.prototype.isWindow = goog.dom.isWindow;
2671
2672
2673/**
2674 * Returns an element's parent, if it's an Element.
2675 * @param {Element} element The DOM element.
2676 * @return {Element} The parent, or null if not an Element.
2677 */
2678goog.dom.DomHelper.prototype.getParentElement = goog.dom.getParentElement;
2679
2680
2681/**
2682 * Whether a node contains another node.
2683 * @param {Node} parent The node that should contain the other node.
2684 * @param {Node} descendant The node to test presence of.
2685 * @return {boolean} Whether the parent node contains the descendent node.
2686 */
2687goog.dom.DomHelper.prototype.contains = goog.dom.contains;
2688
2689
2690/**
2691 * Compares the document order of two nodes, returning 0 if they are the same
2692 * node, a negative number if node1 is before node2, and a positive number if
2693 * node2 is before node1. Note that we compare the order the tags appear in the
2694 * document so in the tree <b><i>text</i></b> the B node is considered to be
2695 * before the I node.
2696 *
2697 * @param {Node} node1 The first node to compare.
2698 * @param {Node} node2 The second node to compare.
2699 * @return {number} 0 if the nodes are the same node, a negative number if node1
2700 * is before node2, and a positive number if node2 is before node1.
2701 */
2702goog.dom.DomHelper.prototype.compareNodeOrder = goog.dom.compareNodeOrder;
2703
2704
2705/**
2706 * Find the deepest common ancestor of the given nodes.
2707 * @param {...Node} var_args The nodes to find a common ancestor of.
2708 * @return {Node} The common ancestor of the nodes, or null if there is none.
2709 * null will only be returned if two or more of the nodes are from different
2710 * documents.
2711 */
2712goog.dom.DomHelper.prototype.findCommonAncestor = goog.dom.findCommonAncestor;
2713
2714
2715/**
2716 * Returns the owner document for a node.
2717 * @param {Node} node The node to get the document for.
2718 * @return {!Document} The document owning the node.
2719 */
2720goog.dom.DomHelper.prototype.getOwnerDocument = goog.dom.getOwnerDocument;
2721
2722
2723/**
2724 * Cross browser function for getting the document element of an iframe.
2725 * @param {Element} iframe Iframe element.
2726 * @return {!Document} The frame content document.
2727 */
2728goog.dom.DomHelper.prototype.getFrameContentDocument =
2729 goog.dom.getFrameContentDocument;
2730
2731
2732/**
2733 * Cross browser function for getting the window of a frame or iframe.
2734 * @param {Element} frame Frame element.
2735 * @return {Window} The window associated with the given frame.
2736 */
2737goog.dom.DomHelper.prototype.getFrameContentWindow =
2738 goog.dom.getFrameContentWindow;
2739
2740
2741/**
2742 * Sets the text content of a node, with cross-browser support.
2743 * @param {Node} node The node to change the text content of.
2744 * @param {string|number} text The value that should replace the node's content.
2745 */
2746goog.dom.DomHelper.prototype.setTextContent = goog.dom.setTextContent;
2747
2748
2749/**
2750 * Gets the outerHTML of a node, which islike innerHTML, except that it
2751 * actually contains the HTML of the node itself.
2752 * @param {Element} element The element to get the HTML of.
2753 * @return {string} The outerHTML of the given element.
2754 */
2755goog.dom.DomHelper.prototype.getOuterHtml = goog.dom.getOuterHtml;
2756
2757
2758/**
2759 * Finds the first descendant node that matches the filter function. This does
2760 * a depth first search.
2761 * @param {Node} root The root of the tree to search.
2762 * @param {function(Node) : boolean} p The filter function.
2763 * @return {Node|undefined} The found node or undefined if none is found.
2764 */
2765goog.dom.DomHelper.prototype.findNode = goog.dom.findNode;
2766
2767
2768/**
2769 * Finds all the descendant nodes that matches the filter function. This does a
2770 * depth first search.
2771 * @param {Node} root The root of the tree to search.
2772 * @param {function(Node) : boolean} p The filter function.
2773 * @return {Array<Node>} The found nodes or an empty array if none are found.
2774 */
2775goog.dom.DomHelper.prototype.findNodes = goog.dom.findNodes;
2776
2777
2778/**
2779 * Returns true if the element has a tab index that allows it to receive
2780 * keyboard focus (tabIndex >= 0), false otherwise. Note that some elements
2781 * natively support keyboard focus, even if they have no tab index.
2782 * @param {!Element} element Element to check.
2783 * @return {boolean} Whether the element has a tab index that allows keyboard
2784 * focus.
2785 */
2786goog.dom.DomHelper.prototype.isFocusableTabIndex = goog.dom.isFocusableTabIndex;
2787
2788
2789/**
2790 * Enables or disables keyboard focus support on the element via its tab index.
2791 * Only elements for which {@link goog.dom.isFocusableTabIndex} returns true
2792 * (or elements that natively support keyboard focus, like form elements) can
2793 * receive keyboard focus. See http://go/tabindex for more info.
2794 * @param {Element} element Element whose tab index is to be changed.
2795 * @param {boolean} enable Whether to set or remove a tab index on the element
2796 * that supports keyboard focus.
2797 */
2798goog.dom.DomHelper.prototype.setFocusableTabIndex =
2799 goog.dom.setFocusableTabIndex;
2800
2801
2802/**
2803 * Returns true if the element can be focused, i.e. it has a tab index that
2804 * allows it to receive keyboard focus (tabIndex >= 0), or it is an element
2805 * that natively supports keyboard focus.
2806 * @param {!Element} element Element to check.
2807 * @return {boolean} Whether the element allows keyboard focus.
2808 */
2809goog.dom.DomHelper.prototype.isFocusable = goog.dom.isFocusable;
2810
2811
2812/**
2813 * Returns the text contents of the current node, without markup. New lines are
2814 * stripped and whitespace is collapsed, such that each character would be
2815 * visible.
2816 *
2817 * In browsers that support it, innerText is used. Other browsers attempt to
2818 * simulate it via node traversal. Line breaks are canonicalized in IE.
2819 *
2820 * @param {Node} node The node from which we are getting content.
2821 * @return {string} The text content.
2822 */
2823goog.dom.DomHelper.prototype.getTextContent = goog.dom.getTextContent;
2824
2825
2826/**
2827 * Returns the text length of the text contained in a node, without markup. This
2828 * is equivalent to the selection length if the node was selected, or the number
2829 * of cursor movements to traverse the node. Images & BRs take one space. New
2830 * lines are ignored.
2831 *
2832 * @param {Node} node The node whose text content length is being calculated.
2833 * @return {number} The length of {@code node}'s text content.
2834 */
2835goog.dom.DomHelper.prototype.getNodeTextLength = goog.dom.getNodeTextLength;
2836
2837
2838/**
2839 * Returns the text offset of a node relative to one of its ancestors. The text
2840 * length is the same as the length calculated by
2841 * {@code goog.dom.getNodeTextLength}.
2842 *
2843 * @param {Node} node The node whose offset is being calculated.
2844 * @param {Node=} opt_offsetParent Defaults to the node's owner document's body.
2845 * @return {number} The text offset.
2846 */
2847goog.dom.DomHelper.prototype.getNodeTextOffset = goog.dom.getNodeTextOffset;
2848
2849
2850/**
2851 * Returns the node at a given offset in a parent node. If an object is
2852 * provided for the optional third parameter, the node and the remainder of the
2853 * offset will stored as properties of this object.
2854 * @param {Node} parent The parent node.
2855 * @param {number} offset The offset into the parent node.
2856 * @param {Object=} opt_result Object to be used to store the return value. The
2857 * return value will be stored in the form {node: Node, remainder: number}
2858 * if this object is provided.
2859 * @return {Node} The node at the given offset.
2860 */
2861goog.dom.DomHelper.prototype.getNodeAtOffset = goog.dom.getNodeAtOffset;
2862
2863
2864/**
2865 * Returns true if the object is a {@code NodeList}. To qualify as a NodeList,
2866 * the object must have a numeric length property and an item function (which
2867 * has type 'string' on IE for some reason).
2868 * @param {Object} val Object to test.
2869 * @return {boolean} Whether the object is a NodeList.
2870 */
2871goog.dom.DomHelper.prototype.isNodeList = goog.dom.isNodeList;
2872
2873
2874/**
2875 * Walks up the DOM hierarchy returning the first ancestor that has the passed
2876 * tag name and/or class name. If the passed element matches the specified
2877 * criteria, the element itself is returned.
2878 * @param {Node} element The DOM node to start with.
2879 * @param {?(goog.dom.TagName|string)=} opt_tag The tag name to match (or
2880 * null/undefined to match only based on class name).
2881 * @param {?string=} opt_class The class name to match (or null/undefined to
2882 * match only based on tag name).
2883 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2884 * dom.
2885 * @return {Element} The first ancestor that matches the passed criteria, or
2886 * null if no match is found.
2887 */
2888goog.dom.DomHelper.prototype.getAncestorByTagNameAndClass =
2889 goog.dom.getAncestorByTagNameAndClass;
2890
2891
2892/**
2893 * Walks up the DOM hierarchy returning the first ancestor that has the passed
2894 * class name. If the passed element matches the specified criteria, the
2895 * element itself is returned.
2896 * @param {Node} element The DOM node to start with.
2897 * @param {string} class The class name to match.
2898 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2899 * dom.
2900 * @return {Element} The first ancestor that matches the passed criteria, or
2901 * null if none match.
2902 */
2903goog.dom.DomHelper.prototype.getAncestorByClass =
2904 goog.dom.getAncestorByClass;
2905
2906
2907/**
2908 * Walks up the DOM hierarchy returning the first ancestor that passes the
2909 * matcher function.
2910 * @param {Node} element The DOM node to start with.
2911 * @param {function(Node) : boolean} matcher A function that returns true if the
2912 * passed node matches the desired criteria.
2913 * @param {boolean=} opt_includeNode If true, the node itself is included in
2914 * the search (the first call to the matcher will pass startElement as
2915 * the node to test).
2916 * @param {number=} opt_maxSearchSteps Maximum number of levels to search up the
2917 * dom.
2918 * @return {Node} DOM node that matched the matcher, or null if there was
2919 * no match.
2920 */
2921goog.dom.DomHelper.prototype.getAncestor = goog.dom.getAncestor;