JQuery: как правильно заменить один элемент — другим?

Question

[Владимир Б.]

Пытаюсь сделать следующее:

this.$ = $( '<image class="poster"' );
...
this.$.replaceWith( '<video src="http://video.com/video">' );

В итоге несмотря на визуальные изменения в DOM, - при обращении к this.$ в качестве элемента - image.poster.

В чём может быть дело?

Answer 1

[Сергей Протько]

ну так ссылка на элемент осталась. Вы только из DOM его выкинули и на его место новый элемент поставили. Ссылки в коде на этот новый элемент у вас нету.

var el = this.$;
this.$ = $('<video src="http://video.com/video">');
el.replaceWith(this.$);

Если проще.

Comments

[Владимир Б.]

Хм, действительно.
Спасибо.

Я относительно ссылки думал, правда как-то так делал:

this.$ = this.$.replaceWith( '<video src="http://video.com/video">' );

Странно что по ссылке элемент не переписался.
Ведь ссылку в принципе постигают все изменения родителя.

[Сергей Протько]

ну так вы по сути сделали detach + after. Вы элемент как курсор для DOM операций используете. От этого сам элемент никуда не денется из коллекции.

[Евгений Петров]

@ange007 это вам не нативный DOM с его replaceChild. Это — jQuery, в котором 90% методов объекта возвращают ссылку на сам объект.

Много ли проку от этого:
this.$ = this.$;