我有 2 個具有相同類名但在 div 中的字串不同的 div。我想在第一個 div 之后使用 insertAfter 來顯示一些額外的文本，但是這些文本都顯示在兩個 div 下：
<div class='test'>First Div</div>
<div class='test'>Second Div</div>
我的做法：
if ( document.getElementsByClassName('test')[0]
&& document.getElementsByClassName('test')[0].innerHTML == 'First Div'
) {
$('<h2>Inserting New Text</h2>').insertAfter('.test')[0];
}
但這會在 First Div 和 Second Div 之后添加文本。我想知道是否有辦法只插入一次或匹配字串后插入
uj5u.com熱心網友回復：
保持簡單，找到所有具有目標類的元素并選擇第一個：
const el = document.getElementsByClassName('test')
$('<div>new text</div>').insertAfter(el[0])<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='test'>First Div</div>
<div class='test'>Second Div</div>uj5u.com熱心網友回復：
您可以要求 javascript 查找類的元素，然后將結果轉換為陣列并找到與您的條件匹配的第一個元素。
const elements = Array.from(document.getElementsByClassName("test"));
const target = elements.find(el => el.innerHTML === 'First Div');
$('<h2>Inserting New Text</h2>').insertAfter(target);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='test'>First Div</div>
<div class='test'>Second Div</div>uj5u.com熱心網友回復：
這里不需要 jQuery。用于insertAdjacentHTML添加新元素。
// Pick up the first element with the test class
const el = document.querySelector('.test');
// Use `insertAdjacentHTML` to add the new div after it
el.insertAdjacentHTML('afterend', '<div>new text</div>');<div class="test">First Div</div>
<div class="test">Second Div</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/421947.html
標籤：
下一篇：Python異步http服務器