Question

我有一个由链接和跨度组成的列表，用于那些无法查看的列表。例如：

<div id="lessons_list">
 <a href="course1.php" id="course1">course 1 </a>
 <a href="course2.php" id="course2">course 2 </a>
 <a href="course3.php" id="course3">course 3 </a>
 <span href="course4.php" id="course4">course 4 </span>
 <span href="course4.php" id="course5">course 5 </span>
</div>

我试图使用jquery来查找该列表中的第一个范围（在本例中为4）并将其转换为链接，这比我想象的要棘手。这是我得到它，不知道为什么它不工作

jQuery(document).ready(function() {
        $('#lessons_list').find('span:first', function() {
            var href = $(this).attr('href');
            $(this).replaceWith('<a href='+href+'>'+$(this).html()+'</a>');

    });
});

Answer 1

看起来find支持某种回调作为第二个参数。 replaceWith确实如此。

$(function() {
        $('#lessons_list').find('span:first').replaceWith(function() {
            var href = $(this).attr('href');
            return '<a href='+href+'>'+$(this).html()+'</a>';
    });
});

Demo

UPD 使用数据属性

<span data-href="course4.php" id="course4">course 4 </span>


$(function() {
        $('#lessons_list').find('span:first').replaceWith(function() {
            var href = $(this).data('href'); 
            return '<a href='+href+'>'+$(this).html()+'</a>';
    });
})

在列表中找到第一个跨度并更改为链接

1 个答案: