JavaScript заменить атрибут Src, если путь имеет значение

Question

У меня есть некоторый код, который включает в себя изображения со следующими src атрибутом:

https://url.com/image/img.jpg 

Я хочу, чтобы заменить любое изображение (или href), который содержит /image/ на своем пути. Таким образом, результат будет:

https://newurl.com/img.jpg 

Я попытался с помощью:

/src="(?:[^'\/]*\/)*([^']+)"/g 

, но не знаете, как получить его только соответствовать /image/ пути, а также при изменении src к href это не похоже, позволяют мне заменить оба.

Чтобы уточнить, я разбираю простой текст, который содержит строки html. Кроме того, мне нужно иметь возможность поддерживать имя файла, но вместо этого следует указать адрес хоста.

Обновление: Вот jsfiddle того, что у меня есть. Хотя он работает для src, он не учитывает /image/ в пути, а также удаляет href.

Answer 1

Obligatory don't use regex to parse HTML...

---

Поскольку вы уже используете JavaScript, вы могли бы использовать родной DOM API для перебора всех img элементов и обновление src атрибутов:

Array.prototype.map.call(document.querySelectorAll('img'), function(img) { 
    img.src = img.src.replace(/\/image\//, '/'); 
}); 

---

Но поскольку вы пояснили, что у вас есть строка, содержащая HTML, вы можете создать временный элемент, вставить строку как HTML, заменить src, а затем получить обновленное значение свойства innerHTML.

Например:

var content = `string of content containing random text, some elements, <p>and paragraphs</p> and more text.. <img src="https://url.com/image/img.jpg" /><img src="https://url.com/image/img.jpg" />`; 
 

 
// Create the temporary DOM element 
 
var temporaryElement = document.createElement('div'); 
 
temporaryElement.innerHTML = content; 
 

 
// Replace the `src` attributes 
 
Array.from(temporaryElement.querySelectorAll('img')).forEach((img) => { 
 
    img.src = img.src.replace(/\/image\//, '/'); 
 
}); 
 

 
// Retrieve the updated `innerHTML` property 
 
var updatedContent = temporaryElement.innerHTML; 
 
console.log(updatedContent);

Answer 2

Это должно работать.

REGEXP:

(?:^(?:https:\/{2})(?:\w*\.*|\d*\.*)(?:\w*|\d*)*(?:\/image\/))(.+)$ 

ВХОД:

https://url.com/image/img.jpg 
https://url.com/image/asdasdasd.jpg 

ЗАМЕНЫ с:https://newurl.com/

https://newurl.com/$1 

РЕЗУЛЬТАТ:

https://newurl.com/img.jpg 
https://newurl.com/asdasdasd.jpg 

JAVASCRIPT КОД:

const regex = /(?:^(?:https:\/{2})(?:\w*\.*|\d*\.*)(?:\w*|\d*)*(?:\/image\/))(.+)$/gm; 
 
const str = `https://url.com/image/img.jpg 
 
https://url.com/image/asdasdasd.jpg 
 
`; 
 
const subst = `https://newurl.com/\$1`; 
 

 
// The substituted value will be contained in the result variable 
 
const result = str.replace(regex, subst); 
 

 
console.log('Substitution result: ', result);

См:https://regex101.com/r/I4hHV7/2