Мне нелегко обернуть голову тем, как получить доступ и изменить атрибуты содержимого HTML, добавленного вместо элемента-заполнителя, с помощью replaceWith.Как изменить атрибуты динамического/живого элемента - (заменитеWith())
Вот сценарий:
Вот HTML (хранится в файле PHP), который заменяет элемент '#null_item' в следующем HTML таблице:
<tr id="sign_options">
\t <td>
\t \t <input class="finalSign" type="hidden" value="" name="item_name_1" />
\t \t <figure class="sample">
\t \t \t <a id="sign_preview_lightbox" href="" rel="lightbox" title="Sign preview">
\t \t \t \t <img id="sign_preview" src="/signs/previews/basic_aluminium_spacer4_f.jpg" alt="Sign preview" title="Sign preview" />
\t \t \t </a>
\t \t </figure>
\t </td>
</tr>
if(localStorage['cartItem']) {
$.get("/cart.php", function(data) {
$('#null_item').replaceWith($(data));//fix this 'replaceWith' kak!
});
}
console.log(signPreview);
console.log(document.getElementById('sign_preview').src);
<table id="quote">
<colgroup>
<col id="sign_col" span="1"><col id="options_col" span="1"><col id="qty_col" span="1"><col id="price_col" span="1"><col id="total_col" span="1">
</colgroup>
<th>Sign</th><th>Options</th><th>Qty</th><th>Price</th><th>Total</th>
<tr id="null_item"><td><span class="italic">Empty</span></td><td></td><td></td><td></td><td id="delivery" class="subtotal">S$0</td></tr>
<tr id="totals"><td></td><td></td><td colspan="2"><span class="boxed">Total signs</span></td><td>S$0</td></tr>
<tr id="totals"><td></td><td></td><td colspan="2"><span class="boxed">Delivery</span></td><td>S$0</td></tr>
<tr id="totals"><td></td><td></td><td colspan="2"><span class="boxed">Installation</span></td><td>S$0</td></tr>
<tr id="discount"><td colspan="2">Discount code <input maxlength="7" class="discountCode" value="" onchange="calculateTotals()" name="discount_code"></td><td colspan="2"><span class="boxed">Discount</span></td><td>-S$0</td></tr>
<tr id="grand_total"><td></td><td></td><td colspan="2"><span class="boxed">Grand total</span></td><td>S$0</td></tr>
<tr id="buy_row"><td colspan="4"><img id="secure" src="/img/payment.png" alt="Secure payment via Paypal" title="Secure payment via Paypal"></td><td><input id="buy_now" class="buy_button" type="submit" name="submit" value="BUY NOW" alt="PayPal . The safer, easier way to pay online." onclick="paypalPasser()" /></td></tr>
</table>
Первый блок HTML успешно заменяет предполагаемый «#null_item» tr, но после этого я не могу заменить scr для «#sign_preview» img, а также не читать любую существующую ссылку src.
Может ли кто-нибудь пролить свет? Я знаю, что для событий нужно использовать функцию .on и нацеливать новый элемент, но я не знаю, как использовать этот метод для изменения атрибутов динамически загружаемых элементов.
Как примечание стороны, ваш HTML разметка не является допустимым, идентификаторы должны быть уникальными в контексте документа –