JavaScript. Подробное руководство, 6-е издание, стр. 213

 b.appendChild(n); // Сделать n дочерним элементом элемента 

}

В разделе 15.5.1 было представлено свойство

outerHTML

элементов и говорилось, что оно не реализовано в текущей версии Firefox. Пример 15.5 демонстрирует, как можно реализовать это свойство в Firefox (и в любом другом броузере, поддерживающем свойство

innerHTML

, позволяющем расширять объект-прототип

Element.prototype

и имеющем методы определения методов доступа к свойствам). Здесь также демонстрируется практическое применение методов

removeChild()

cloneNode().

Пример 15.5. Реализация свойства outerHTML с помощью свойства innerHTML

<b>И Реализация свойства outerHTML для броузеров, не поддерживающих его.</b>

<b>// Предполагается, что броузер поддерживает свойство innerHTML, возможность </b>

<b>// расширения Element.prototype и позволяет определять методы доступа к свойствам. </b>

(function() {

<b>  // Если свойство outerHTML уже имеется - просто вернуть управление </b>

 if (document.createElement("div").outerHTML) return;

 // Возвращает окружающую разметку с содержимым элемента,

 // на который указывает ссылка this 

 function outerHTMLGetter() {

 var container = document.createElement("div"); 

 // Фиктивный элемент 

 container.appendChild(this.cloneNode(true)); // Копировать this

<b>                                                      // в фиктивный элемент</b>

 return container.innerHTML; // Вернуть содержимое

<b>                                                  // фиктивного элемента</b>

 }

<b>  // Замещает указанным значением value содержимое элемента, на который </b>

 // указывает ссылка this, вместе с окружающей разметкой HTML 

 function outerHTMLSetter(value) {

<b>    // Создать фиктивный элемент и сохранить в нем указанное значение </b>

 var container = document.createElement("div"); 

 container.innerHTML = value;

 // Переместить все узлы из фиктивного элемента в документ 

 while(container.firstChild) // Продолжать, пока в контейнере

<b>                                // не останется дочерних элементов</b>

 this.parentNode.insertBefore(container.firstChild, this);

 // И удалить замещаемый узел 

 this.parentNode.removeChild(this);

 }

<b>  // Использовать эти две функции в качестве методов чтения и записи свойства outerHTML </b>

<b>  // всех объектов Element. Использовать метод Object.defineProperty, если имеется,</b>

 // в противном случае использовать __defineGetter__ и __defineSetter__.

 if (Object.defineProperty) {

 Object.defineProperty(Element.prototype,

 "outerHTML", 

 { get: outerHTMLGetter,

 set: outerHTMLSetter, 

 enumerable: false, 

 configurable: true

 }):

 }

 else {

 Element.prototype.__defineGetter__("outerHTML", outerHTMLGetter); 

 Element.prototype.__defineSetter__("outerHTML", outerHTMLSetter);

 }

}());

15.6.4. Использование объектов DocumentFragment

Объекты

DocumentFragment

- это особая разновидность объектов

Node

; они служат временным контейнером для других узлов. Создаются объекты

DocumentFragment

следующим образом:

var frag = document.createDocumentFragment();

Как и узел

Document

, объекты

DocumentFragment

являются самостоятельными и не входят в состав какого-либо другого документа. Его свойство

parentNode

всегда возвращает значение null. Однако, как и узлы

Element

, объекты

DocumentFragment

могут иметь любое количество дочерних элементов, которыми можно управлять с помощью методов

appendChild(), insertBefore()

и т. д.