如何从带有 jQuery 的标题中添加 data-attr 和 class?

How to add data-attr and class from title with jQuery?

我在页面上有一个标题为 "class className dataAttr" 的元素。 我想创建一个 jQuery 代码,将 className 添加到 class="className" 并将 dataAttr 添加到 data-icon="dataAttr" 从标题。 这是我的代码:

<script> 
$(document).ready(function () {

    $("[title*='class']").addClass(function () {
        return $(this).attr('title');
    }).attr('data-icon', function () {
        str = $(this).attr("title");
        str = str.replace('class', '');
        return str
    }).removeClass('class').removeAttr('title');
});
</script>

但是此脚本也将 className 和 dataAttr 添加到 class 和 data-icon 中。我认为 space 或 className 和 dataAttr 之间的符号会有一些条件单独添加。 我不知道该怎么做。你知道一些解决方案吗? 我希望你能理解我的问题。

以下代码片段有效:

 
 $( document ).ready(function() {

 $("[title*='class']").each(function() {
       var title = $(this).attr('title');
       var titleArray = title.split(" ");
       $(this).addClass(titleArray[1]);
       $(this).attr("data-icon", titleArray[2]);
       $(this).removeAttr('title');
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p title="class className dataAttr">test</p>