У меня есть этот HTML:
<div class="header">A subject</div>
<span class="start"></span>
<table>
<tbody>
<tr><td>1</td></tr>
</tbody>
</table>
<p>a paragraph</p>
<span class="end"></span>
<div class="footer">a note</div>
Также у меня есть переменная, которая содержит некоторые другие теги, как это:
var html = "<section> something <a href="#">my link</a> </section>;
Все, что я хочу сделать, это заменить все между .start
и .end
переменной html
. Как я могу это сделать?
Это ожидаемый результат:
<div class="header">A subject</div>
<span class="start"></span>
<section> something <a href="#">my link</a> </section>
<span class="end"></span>
<div class="footer">a note</div>
Поскольку никакой оболочки не существует, я не могу использовать функции .html()
или .replaceWith()
. Есть ли идея?
2 ответа
Для этого вы можете выбрать .start
, а затем nextUntil()
выбрать элементы между ними и .end
перед их удалением. Затем вы можете вставить новый контент после .start
, например так:
$('.start').nextUntil('.end').remove();
$('<section> something <a href="#">my link</a></section>').insertAfter('.start');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="header">A subject</div>
<span class="start">START</span>
<table>
<tbody>
<tr>
<td>1</td>
</tr>
</tbody>
</table>
<p>a paragraph</p>
<span class="end">END</span>
<div class="footer">a note</div>
Поскольку вы используете jQuery, вы можете использовать метод .nextUntil()
. Это позволит вам выбрать диапазон элементов, пока элемент не будет указан в качестве параметра метода.
$('.start').nextUntil('.end')
выберет каждый элемент от .start
до .end
(независимо от того, насколько музыкальным это может звучать).
После этого вы можете удалить выбранные элементы и добавить нужный HTML с помощью .before()
.
$('.start').nextUntil('.end').remove();
$('.end').before(myHTMLVariable);
(Для справки: https://api.jquery.com/nextUntil/).
Похожие вопросы
Связанные вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.