如何h3在頁面上找到包含 ID 的所有內容attr，將它們保存到陣列中，然后將它們作為串列輸出到其他地方（以 H3 作為值，以 id 作為 href）？最好使用 jQuery，如果沒有，也可以使用 PHP。
到目前為止，這是我想出的創建陣列的方法（我更喜歡將它們放在一個陣列中）：
var ids = [];
var values = [];
i = 0;
e = 0;
$('h3').each(function()
{
if($(this).attr('id')){
ids[i ] = $(this).attr('id');
values[e ] = $(this).text();
}
});
所以如果我們有這樣的 HTML：
<div class="headers">
<h3 id="first">First</h3>
<h3 id="second">Second</h3>
<h3>None</h3>
<h3 id="third">Third</h3>
<h3>None Do not Show</h3>
</div>
<div class="headers-in-here"></div>
我希望“headers-in-here”中的輸出是：
<li><a href="#first">First</a></li>
<li><a href="#second">Second</a></li>
<li><a href="#third">Third</a></li>
uj5u.com熱心網友回復：
您可以找到所有h3具有idusing 選擇器h3[id]（標記選擇器和屬性存在選擇器的組合）的元素，然后將其映射到您想要的結構。例如：
const headers = $("h3[id]").get().map(element => ({id: element.id, text: $(element).text()}));
然后使用該陣列生成您想要的內容；也許：
$(".headers-in-here").html(
headers.map(({id, text}) => `<li><a href="#${id}">${text}</a></li>`).join("")
);
現場示例：
顯示代碼片段
const headers = $("h3[id]").get().map(element => ({id: element.id, text: $(element).text()}));
$(".headers-in-here").html(
headers.map(({id, text}) => `<li><a href="#${id}">${text}</a></li>`).join("")
);<div class="headers">
<h3 id="first">First</h3>
<h3 id="second">Second</h3>
<h3>None</h3>
<h3 id="third">Third</h3>
<h3>None Do not Show</h3>
</div>
<div class="headers-in-here"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>或者您可以一步完成，而不是使用物件的中間陣列，但您特別提到需要一個陣列。這是一個步驟：
$(".headers-in-here").html(
$("h3[id]").get().map(element => `<li><a href="#${element.id}">${$(element).text()}</a></li>`).join("")
);
現場示例：
顯示代碼片段
$(".headers-in-here").html(
$("h3[id]").get().map(element => `<li><a href="#${element.id}">${$(element).text()}</a></li>`).join("")
);<div class="headers">
<h3 id="first">First</h3>
<h3 id="second">Second</h3>
<h3>None</h3>
<h3 id="third">Third</h3>
<h3>None Do not Show</h3>
</div>
<div class="headers-in-here"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/336954.html