Найдите ссылки, содержащие определенную строку в href, и удалите href между косыми чертами только с помощью javascript
У меня есть вариант использования, когда мне нужно выбрать все <a>, содержащие строку в URL-адресе, например «/web/local», и удалить «/web/local» из всех ссылок всех этих ссылок.
Примечание: я не могу использовать jQuery. Я могу использовать либо чистый js, либо YUI.
Заранее спасибо.
Я сделал несколько попыток с совпадениями document.querySelector +, но не уверен, как правильно их использовать. Также существует ли какой-либо метод, например .contain()?
@designershyam Вы должны предоставить фрагменты или образцы своего кода, чтобы люди могли предложить, как его улучшить.
document.querySelectorAll('a') вернет все теги привязки. Затем вы можете проверить и сравнить свойства HREF каждого из возвращенных элементов и изменить их по мере необходимости. Я позволю вам сначала попробовать код, прежде чем публиковать ответ.
@daddygames querySelectorAll('a') вернет список узлов, а не теги привязки.
@ScottMarcus Упс! Спасибо, что прояснили это!
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "UTF-8">
<meta name = "viewport" content = "width=device-width, initial-scale=1.0">
<meta http-equiv = "X-UA-Compatible" content = "ie=edge">
<title>Document</title>
</head>
<body>
<a href = "http:///web/locale/google.com">Link 1</a>
<a href = "http:///web/locale/stackoverflow.com">Link 2</a>
<script>
var string = '/web/locale/';
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
var link = links[i].getAttribute('href');
link = link.replace(string, '');
links[i].setAttribute('href', link);
}
</script>
</body>
</html>
getElementsByTagName() возвращает список активных узлов и должен использоваться только в редких случаях. Кроме того, вместо того, чтобы получать все ссылки и работать с href на всех них, вам действительно следует просто получить те, которые нужно заменить в первую очередь.
См. встроенные комментарии:
let phrase = "/web/local";
// Get all the links that contain the desired phrase into an Array
let links = Array.prototype.slice.call(document.querySelectorAll("a[href*='" + phrase +"']"));
// Loop over results
links.forEach(function(link){
// Remove the phrase from the href
link.href = link.href.replace(phrase, "");
});
// Just for testing:
console.info(document.querySelectorAll("a"));<a href = "http://www.something.com/web/local">Some Link</a>
<a href = "http://www.something.com/web/local">Some Link</a>
<a href = "http://www.something.com/web/local">Some Link</a>
<a href = "http://www.something.com/web/local">Some Link</a>
<a href = "http://www.something.com/web/local">Some Link</a>Чтобы правильно получить/установить атрибут href, вам нужно использовать получить атрибут/setAttribute:
document.querySelectorAll('a[href* = "/web/local"').forEach(function(ele) {
ele.setAttribute('href',
ele.getAttribute('href').replace('/web/local', ''));
console.info(ele.outerHTML);
});<a href = "/web/local"></a>
<a href = "22222/web/local"></a>
<a href = "/web/local"></a>Вам не «нужно» использовать set/getAttribute. Вы также можете работать со свойством .href DOM.
@ScottMarcus: я знаю, но используя свойство href вместо атрибута, вы меняете сам href, добавляя полный путь...... Спасибо
Итак, ваши усилия до сих пор? пожалуйста, добавьте код, который вы пробовали до сих пор