jQuery：找到H2 ID和附加鏈接相同的ID

Question

我有以下代碼，我想每H2與id屬性我會創建一個錨鏈接。我不能讓它正常工作......

<div id="mydiv"> 
    <h2 id="first">first</h2> 
    <h2>second</h2> 
    <h2 id="third">third</h2> 
</div> 

.sls {color: red;font-size: 12px;} 

$('#mydiv') 
.find('h2[id]') 
.append(' <a href="http://www.test.com/page.html#'+ $('h2[id]') 
.attr('id') +'" class="sls">Link</a>'); 

https://jsfiddle.net/ivanionut/1ohh2hws/

感謝您的幫助。

Answer 1

你想要這樣的東西嗎？

$('#mydiv').find('h2[id]').each(function() { 
 
    $(this).append(' <a href="http://www.test.com/page.html#'+ $(this).attr('id') +'" class="sls">Link</a>'); 
 
});

.sls { 
 
    color: red; 
 
    font-size: 12px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="mydiv"> 
 
\t <h2 id="first">first</h2> 
 
\t <h2>second</h2> 
 
\t <h2 id="third">third</h2> 
 
</div>

Answer 2

在你追加叫你正在使用$（'H2 [ID]）。ATTR（）這將讓發現該組中的第一個元素的屬性，所以它總是獲得第一個h2的id。使用功能更新中追加使用這個代碼，就像這樣：

.append(function() { 
    return '<a href="http://www.test.com/page.html#'+ $(this).attr('id') +'"class="sls">Link</a>' 
}); 

https://jsfiddle.net/1ohh2hws/2/