Как выбрать элемент по содержимому тела?

Question

На моей странице есть следующий элемент:

<u>abc123</u>

Как выбрать этот элемент и изменить его содержимое 'abc123' на что-то еще?

Что я на самом деле пытаюсь сделать, так это добавить iframe между <u></u>. Я знаю, что это глупо, но у меня есть к этому особые требования.

Второй вопрос: возможно ли заменить целое (<u>abc123</u>) на iframe, или тег iframe должен находиться между <u></u>?

Спасибо!

Answer 1

Для фильтрации по содержанию (пример):

$("u").filter(function(){
    return $(this).text() == "abc123";
}).html("<iframe>");

Для непосредственного выполнения кода:

$("u").each(function(){
    var $this = $(this);
    if($this.text() == "abc123"){
        $this.html("<iframe>");
    }
})

Используйте .replaceWith() вместо .html(), если хотите также заменить теги (<u></u>).

Метод .html() перезаписывает текущее содержимое элемента. Если вы хотите добавить новую информацию, не стирая предыдущие данные, используйте .append().

Answer 2

попробуйте это:

JS

$("u").html('<iframe src="http://www.google.com" width="300" height="300">Alternative context</iframe>');

Answer 3

вы можете добавить контент к вашей функции Text ().

$("u").text(yourText);

для выбора элемента по его содержимому

$("u").each(function(i) {
    if ($(this).text()=="abc123"){
     //do what you want
}
   });

Answer 4

Таким способом можно заменить элемент на iframe (это прямой JavaScript, но вы можете сделать это и в jQuery):

<u id="test"></u>

var e = document.getElementById('test');
var iFrame = [...];

e.parentNode.insertBefore(iFrame, e);
e.parentNode.removeChild(e);

Спасибо