Как изменить атрибут "href" ссылки на определенный "href" с помощью jQuery?

#javascript #jquery #html #attributes #href

#javascript #jquery #HTML #атрибуты #href

Вопрос:

Если на страницах есть несколько ссылок как таковых:

 <a href="http://www.domain.com/linka.html">Link A</a>
<a href="http://www.domain.com/linkb.html">Link B</a>
<a href="http://www.domain.com/linkc.html">Link C</a>
<a href="http://www.domain.com/linkd.html">Link D</a>

Как мне изменить их все при загрузке страницы на :

 <a href="http://www.domain.com/folder/linka.html">Link A</a>
<a href="http://www.domain.com/folder/linkb.html">Link B</a>
<a href="http://www.domain.com/folder/linkc.html">Link C</a>
<a href="http://www.domain.com/folder/linkd.html">Link D</a>

Ответ №1:

Вам нужно выбрать все привязочные теги, href атрибут которых начинается с «link» с помощью [name^=”value”] селектора и заканчивается «.html» с помощью [name$=”value”] селектора. Затем используйте .attr(function) для итерации выбранного элемента и изменения атрибута href для них в функции.

 $("a[href^='link'][href$='.html']").attr("href", function(i, attr){
    return "folder/"   attr;
});

Показать фрагмент кода

 $("a[href^='link'][href$='.html']").attr("href", function(i, attr){
  return "folder/"   attr;
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="linka.html">Link A</a>
<a href="linkb.html">Link B</a>
<a href="linkc.html">Link C</a>
<a href="linkd.html">Link D</a>

Также вы можете записать код $(document).ready(function(){//code}) для запуска после загрузки страницы.

Ответ №2:

 $.each($("a[href^='link'][href$='.html']"),function(){
$(this).attr("href",document.URL "folder/" $(this).attr("href"))
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="linka.html">Link A</a>
<a href="linkb.html">Link B</a>
<a href="linkc.html">Link C</a>
<a href="linkd.html">Link D</a>