如何通過jQuery將跨度標簽中的文本添加到數據屬性中？

Question

如何將文本從span標簽添加到data-attr？

例：
我有這個代碼

 <div class="clearfix colelem" id="u92-5"><!-- content --> <p>Icon<span id="u92-2">iconsymbol</span></p> </div> 

我想將iconsymbol添加到相同元素的data-attr =“iconsymbol”中，例如：

 <div class="clearfix colelem" id="u92-5" data-attr="iconsymbol"><!-- content --> <p>Icon<span id="u92-2">iconsymbol</span></p> </div> 

是的，它將與所有帶有title =“ icon”的元素一起使用

 <script> $( document ).ready(function() { $("[title*='icon']").attr('data-attr',function(){ // I don't know }).removeAttr('title'); }); </script> 

你知道怎么做嗎？ 所以我知道這很簡單，但是我是jquery的新手，需要您的幫助。
我希望你理解我的問題。

Answer 1

這是一個適合您的示例。 您可能有幾種方法可以實現此目標，但這有望使您入門。 請參閱附件中的JSFiddle來查看實際示例

$(function() {
    $('[title*="icon"] span').each(function(){
        $(this).parent().closest('div').attr('data-attr', $(this).text())
    });
});

這是您也可以執行此操作的另一種方法

$('[title*="icon"]').each(function(){
    $(this).attr('data-attr', $(this).children().closest('span').text());
});

JSFiddle示例

Answer 2

您的<div>應該具有屬性title="icon"

您正在使用attr()函數的回調，因此返回需要使用.text()在函數內部設置的值。

$(document).ready(function () {
    $("[title='icon']").attr('data-attr', function () {
        return $(this).find('span').text();
    }).removeAttr('title');
});

演示版