jquery - 使用 jquery 将链接更改为标准段落

Question

我有一个正在动态构建的列表，并且正在使用一些链接来填充数据。问题是我不希望数据像链接一样，但它是作为链接 (a) 出现的，我想在加载时将其更改为 (p) 以删除任何链接功能，但我需要保留 href 标签. 基本上，有没有办法在加载时只更改 HTML 标记，而不必清空并附加整个内容块？

Answer 1

$('a.specific_link_class').each(function(idx, el){

  $( this ).replaceWith( "<p data-href='" + $(this).attr('href') +"'>" + $( this ).text() + "</p>" );


});

这会将具有特定类的所有链接（使用适当的选择器更改类）更改为 p 标签，并将 href 作为新 p 标签的 data-href 属性。

Answer 2

与我之前的答案不同，如果您执行以下操作，则可以将链接的 HREF 部分保留为数据属性：

$('a').each(
    var e = $(this);
    e.replaceWith('<p data-href="' + e.attr('href') + '">' + e.html() + '</p>');
});

要访问该 HREF，您稍后会执行以下操作：

$('p').data('href');

Answer 3

尝试类似：

$('a').click(function(e){
  e.preventDefault();
});

这将使您的 a 标签不可点击，但它们仍保留所有属性

Answer 4

您可以尝试阻止这些链接上的点击事件并更改光标以保留 A 标记以及您可能需要的任何 CSS（或用类似段落的格式替换该格式）：

JS：

$('a').on('click', function() {return false;});

CSS：

a {cursor: default;}

此外，如果您确实需要，您可以将这些链接包装在段落中以实际构建该 P 标签：

$('a').wrap('<p></p>');

Answer 5

简单地添加“onclick=return false;”不是更明智的选择 ? Href 不是 P 的有效属性 - 它在语义上是错误的。或者，您可以将 element 更改为 p 并将其放入 data-href 属性中。