Создание ссылок для элементов с определенным классом с помощью jQuery

Question

Как можно обернуть каждый элемент, принадлежащий определенному классу, ссылкой, которая построена из текста внутри div? Я имею в виду, что я хотел бы включить:

<foo class="my-class>sometext</foo>

в

<a href="path/sometext" ><foo class="my-class>sometext</foo></a>

Символы Url-кодировки тоже подойдут, но при необходимости их можно проигнорировать.

РЕДАКТИРОВАТЬ : просто уточнить, путь зависит от текста в элементе

Answer 1

$(".my-class").each(function(){
  var thisText = $(this).text();
  $(this).wrap("<a></a>").attr("href","path/"+thisText);
});

Answer 2

Используйте jQuery.wrap() для простого случая:

$(".my-class").wrap("<a href='path/sometext'></a>");

Для обработки текста внутри:

$(".my-class").each(function() {
  var txt = $(this).text();
  var link = $("<a></a>").attr("href", "path/" + txt);
  $(this).wrap(link[0]);
});

Answer 3

вы можете обернуть их внутри элемента привязки следующим образом:

$(document).ready(function(){
    $(".my-class").each(function(){
           var hr="path/"+$(this).text();
           $(this).wrap("<a href='"+hr+"'></a>");
   });
});

если вы открываете ссылки на той же самой странице, то проще, чем модифицировать dom, чтобы обернуть элементы внутри якоря, - определить css для элементов, чтобы они выглядели как ссылки, а затем обработать событие click:

$(".my-class").click(function(){
     window.location.href="path/"+$(this).text();
});

Answer 4

$("foo.my-class").each(function(){
  var foo = $(this);
  foo.wrap("<a href='path/" + foo.Text() +"'>");
});

Answer 5

Это должно сделать это:

$('foo.my-class').each(function() {
  var element = $(this);
  var text = element.html(); // or .text() or .val()
  element.wrap('<a href="path/' + text + '"></a>');
});