如何通过 jQuery 将 span 标签中的文本添加到 data-attr？

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" 中，如 a:

<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 Example

Answer 2

您的 <div> 应该具有属性 title="icon"

您正在使用 attr() 函数的回调，因此 return 您需要使用 .text().

在函数内部设置的值

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

Demo

如何通过 jQuery 将 span 标签中的文本添加到 data-attr？

How to add text from span tag to data-attr by jQuery?

html

javascript

tags

jquery

attr

JSFiddle Example