如何通过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');
});

演示版