Динамическое добавление/изменение элемента HTML с другими элементами/атрибутами ⇐ Html

[Anonymous]

Я не уверен, возможно ли это или нет, но я получаю элемент от бэкэнда, и я пытаюсь изменить его, чтобы преобразовать слово в ссылку. Это все в Vue3/TypeScript.
Пример бэкэнд -данных, которые я могу получить:

Код: Выделить всё

Foo bar bash is zoo monster poop zebra

попытка
скажем, что я пытаюсь преобразовать все слова, которые начинаются с z в href
const convertWordToHashtag = (element: BackendDataSample) => {
// extracts the text portion of the content to an array of words
const textArray = element.textContent.split(' ');
// checks if anything starts with z
textArray.forEach((word: string) => {
if (word && word.charAt(0) === 'z') {
let newElement = document.createElement('a');
newElement.href = `https://www.google.com/${word}`;
newElement.textContent = word;

// go back to the original element
element.textContent.replace(word, newElement);
}
});
}
< /code>
Моя цель - по существу преобразовать элемент, который будет использоваться, чтобы он прочитал: < /p>

Foo bar bash is zoo monster poop zebra

< /code>
Но, похоже, это не вызывает ошибки замены. Это правильный подход или есть более простой способ сделать это?

Подробнее здесь: https://stackoverflow.com/questions/797 ... attributes