Question

如何添加每个列表项的链接？

基本上我有一个列表，我想使用js或jquery添加到我的搜索页面的href中。

<aside class="listlinks">
        <ul>
            <li>CRM</li>
            <li>CTI</li>
            <li>Call Center</li>
            <li>Data warehouse</li>
            <li>Documentum D2</li>
            <li>MDM</li>
            <li>SharePoint</li>
        </ul>
    </aside>

$('.listlinks').each(function(){
    $(this).wrapInner('<a href="\search.php?' + $(this).html() + '" />');
});

Answer 1

只要您更新jQuery选择器以匹配列表项而不是父列表，例如，您的示例就会起作用。将.listlinks替换为.listlinks ul li。您还应确保使用href或encodeURI正确编码encodeURIComponent部分中的文字。

你真的不需要jQuery，使用纯Javascript和手动连接可以为每个列表项保存3-4个函数调用。

$('.listlinks ul li').each(function(){
    this.innerHTML = '<a href="\search.php?' + encodeURIComponent(this.innerHTML) + '">' + this.innerHTML + '</a>';
});

您可以通过牺牲每个列表项的一个函数调用并使用String.prototype.link来进一步缩短这一点。 link方法使用指向提供的URL的超链接自动包装字符串对象。

$('.listlinks ul li').each(function(){
    this.innerHTML = this.innerHTML.link('\search.php?' + encodeURIComponent(this.innerHTML));
});

Answer 2

$('.listlinks ul li').each(function(){
    $(this).append('<a href="\search.php?' + $(this).html() + '" />');
});

Answer 3

你可以做到

$('.listlinks ul li').each(function(){
    var text = $(this).html();
    $(this).html('<a href="\search.php?' +  encodeURIComponent(text) + '">' + text +  '</a>');
});

更新：确保对网址中的文本进行编码。记得那个

Answer 4

@Rayen Kamta试试这个：

$.each($('.listlinks li'),function(k,v){
    $(v).wrap('<a href="\search.php?' + $(v).html() + '" />');
});

JS或Jquery添加链接到列表项

4 个答案: