replaceWith () не работает на клонированных, отдельных узлах - PullRequest
3 голосов
/ 18 декабря 2011

replaceWith() не работает должным образом для меня.Например, учитывая этот HTML:

<div id="tree1">
    <div>
        <h3>Item 1</h3>
        <h3>Item 2</h3>
        <h3>Item 3</h3>
    </div>
</div>

, этот код не заменяет узлы <h3> на <li> s:

var items_Bad   = $("#tree1 div h3").clone ();

$("#tree1 div").remove ();
$("#tree1").append ('<ul id="Items1"></ul>');

//--- This does not replace anything!
items_Bad.replaceWith (function () {
    return ('<li>' + $(this).text () + '</li>');
} );

$("#Items1").append (items_Bad);


Но этот код делает!:

var items_Good  = $("#tree1 div h3").clone ();

$("#tree1 div").remove ();
$("#tree1").append ('<ul id="Items1"></ul>');

$("#Items1").append (items_Good);

//--- But, this works!
$("#Items1 h3"). replaceWith (function () {
    return ('<li>' + $(this).text () + '</li>');
} );


См. JsFiddle.

Здесь replaceWith() работает, только если узлы (повторно) подключеныв DOM, но документация гласит:

Начиная с jQuery 1.4, .replaceWith () также может работать на отключенных узлах DOM.* Чего мне не хватает?

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

1 Ответ

5 голосов
/ 18 декабря 2011

Приведенный ниже код является частью replaceWith(), которая касается замены отдельных узлов (взятых прямо из источника jQuery 1.7.1 , по модулю незначительных различий в форматировании):

replaceWith: function(value) {
    if (this[0] && this[0].parentNode) {
        // This deals with attached nodes...
    } else {
        return this.length
            ? this.pushStack(jQuery(jQuery.isFunction(value) ? value() : value),
                "replaceWith", value)
            : this;
    }
}

Как видите, есть два ограничения, которые не позволяют этому коду выполнять ваши требования:

  • Предоставленная функция вызывается только один раз, а не один раз для элемента в наборе,
  • Предоставляемая функция вызывается в глобальном контексте (т. Е. Заменяемый элемент недоступен через ключевое слово this).

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

...