#javascript #jquery #html #string
#javascript #jquery #HTML #строка
Вопрос:
У меня есть jQuery, который принимает 2 строки HTML. Каждая строка содержит точно такой же html, за исключением того, что в одной строке содержимое внутреннего текста каждого элемента будет отличаться, эта строка называется newContent, другая oldContent .
Моя функция: выполняет итерацию по oldContent, для каждого элемента класса «обновляемый» (внутри oldContent) мы меняем его внутренний текст на внутренний текст того же элемента в newContent.
Моя проблема: это не изменяет содержимое oldContent, после того, как я выполняю функцию, oldContent содержит точно такой же HTML (где должно произойти то, что элементы обновляемого класса должны иметь другой внутренний текст).
Почему строка oldContent не изменяется?
function insertContentIntoUpdatableElements( oldContent, newContent )
{
// Pre: oldContent amp; newContent must be strings of HTML returned from jquery's
// $("").html()
try
{
alert("BEFORE: " oldContent);
var index = 0;
var oldElements = $(oldContent).find(".updatable");
var newElements = $(newContent).find(".updatable");
$(oldContent).find(".updatable").each( function()
{
var txt = $(newElements[index]).text(); alert("TEXT: " txt);
alert("OLD TEXT: " $(this).text());
$(this).text(txt);
index ;
alert("NEW TEXT: " $(this).text()); // prints out CORRECT updated/changed text
});
alert("AFTER: " oldContent); // prints out INCORRECT updated/changed text for each element of class "updatable"
return oldContent;
}
catch(ex) { alert("In insertContentIntoUpdatableElements(): " ex); return "FAILED"; }
}
Ответ №1:
Это должно сработать.
function insertContentIntoUpdatableElements( oldContent, newContent )
{
var result = $(oldContent);
var oldElements = result.find(".updatable");
var newElements = $(newContent).find(".updatable");
$(oldElements).each(function(index, el)
{
$(oldElements[index]).text($(newElements[index]).text());
});
return resu<
}
Смотрите рабочую демонстрацию на jsFiddle: http://jsfiddle.net/ZZVgh /