Не может заменить div внутри iframe от его родителя

Question

У меня есть фрейм, который я заполнил следующим образом:

var usableUrl = unescape(url);
var iframe = $("<iframe id='pageContentDownloader' name='pageContentDownloader' style='display:block'></iframe>");
$("body").append(iframe);
iframe.load(usableUrl, null, ondocloaded);
iframe.css({ "width": $(window).width(), "height": $(window).height(), "border": "0px" });

Позже я хочу заменить все

s и

s на их модифицированные версии:

$("#pageContentDownloader").contents().find("p, div")
            .each(function () {
                var para = $(this).text();
                var words = para.split(" ");
                var aWords = new Array();
                $.makeArray(words, aWords);
                var newPara = makePara(aWords);
                $(this).replaceWith(newPara);
            });

Но по какой-то причине последняя команда не работает. Я вижу, что $(this) - это оригинальный параграф внутри iframe (я вижу его содержимое и знаю, что это оригинальная немодифицированная версия параграфа), а newPara определенно содержит соответственно измененное содержимое.

Кажется, $(this).replaceWith() работает неправильно. Комментарии о проблемах с заменой тегов текстовыми элементами в replaceWith API документах здесь не применимы, так как замена

заполнена s. Это какая-то странная проблема

Answer 1

Вы не показываете, что делает newPara(), но если он создает новый элемент DOM, это может быть корнем проблемы: вы неявно перемещаете узел из одного документа в другой. может заключаться в том, что iframe к этому не относится (хотя в принципе должно быть сообщение об ошибке).

Если это так, вам придется создать элемент DOM в iframe или вставить необработанный HTML вместо готового узла.

Вместо этого можно попробовать $(iframe).document.createElement("p");, чтобы создать элемент

$(html) имеет второй аргумент, ownerDocument. Попробуйте явно указать $(iframe).document как ownerDocument при создании заменяемого элемента.