Retire todos los nodos con (nodeName = “script”) a partir de un documento Fragmento * antes de colocarlo en dom *

Question

Mi objetivo es eliminar todo <[script]> linfáticos de un fragmento de documento (dejando el resto del fragmento intacto) antes de insertar el fragmento en el DOM.

Mi fragmento se crea y se ve algo como esto:

    range = document.createRange();
    range.selectNode(document.getElementsByTagName("body").item(0));
    documentFragment = range.cloneContents();
    sasDom.insertBefore(documentFragment, credit);
    document.body.appendChild(documentFragment);

Tengo buena gama sugerencias Walker en un post aparte, pero di cuenta de que la pregunta equivocada. Tengo una respuesta acerca de rangos, pero lo que quería preguntar sobre era un fragmento de documento (o tal vez hay una manera de establecer un rango del fragmento? Hrmmm). El andador proporcionado fue:

function actOnElementsInRange(range, func) {
function isContainedInRange(el, range) {
    var elRange = range.cloneRange();
    elRange.selectNode(el);
    return range.compareBoundaryPoints(Range.START_TO_START, elRange) <= 0
            && range.compareBoundaryPoints(Range.END_TO_END, elRange) >= 0;
}

var rangeStartElement = range.startContainer;
if (rangeStartElement.nodeType == 3) {
    rangeStartElement = rangeStartElement.parentNode;
}

var rangeEndElement = range.endContainer;
if (rangeEndElement.nodeType == 3) {
    rangeEndElement = rangeEndElement.parentNode;
}

var isInRange = function(el) {
    return (el === rangeStartElement || el === rangeEndElement ||
                isContainedInRange(el, range))
        ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
};

var container = range.commonAncestorContainer;
if (container.nodeType != 1) {
    container = container.parentNode;
}

var walker = document.createTreeWalker(document,
    NodeFilter.SHOW_ELEMENT, isInRange, false);

while (walker.nextNode()) {
    func(walker.currentNode);
}
}

actOnElementsInRange(range, function(el) {
    el.removeAttribute("id");
});

Ese código Walker se levanta de: eliminar todos los atributos de identificación de nodos en una gama de Fragmento

FAVOR No hay bibliotecas (es decir, jQuery). Quiero hacer esto de la manera cruda. Gracias de antemano por su ayuda

Answer 1

La forma más fácil de reunir todos los nodos <script> sería utilizar getElementsByTagName, pero por desgracia no está implementada en DocumentFragment.

Sin embargo, se podría crear un contenedor temporal y añadir todos los elementos dentro del fragmento, y luego ir a través y eliminar todos los elementos <script>, así:

var temp = document.createElement('div');

while (documentFragment.firstChild)
    temp.appendChild(documentFragment.firstChild);

var scripts = temp.getElementsByTagName('script');
var length = scripts.length;

while (length--)
    scripts[length].parentNode.removeChild(scripts[length]);

// Add elements back to fragment:
while (temp.firstChild)
    documentFragment.appendChild(temp.firstChild);

Answer 2

corrígeme si estoy equivocado, pero si el DocumentFragment es un verdadero DOM Fragmento, usted debería ser capaz de hacer algo como:

var scripts = documentFragment.getElementsByTagName('script');
if (scripts.length){
  for (var i=0, l = scripts.length;i<l;i++){
    documentFragment.removeChild(scripts[i]);
  }
}

¿verdad?

Corrección: no se puede aplicar a un getElementsByTagName DocumentFragment, J-P es correcto. Sin embargo, puede un niño nos del fragmento de si se trata de un (clonado) de nodo de soporte getElementsByTagName. Aquí hay algunos (de trabajo) de código que su uso dentro de un guión más grande hace unos días:

var fragment = d.createDocumentFragment(), f;
fragment.appendChild(document.createElement('div'));
fragment.firstChild.appendChild(zoeklijst.cloneNode(true));
f = fragment.firstChild;
return f.getElementsByTagName(getList); //<==