[JavaScript Array] modifier un code html sans le supprimer/recréer

mickou51 · 20 Juin 2022

Salut

Voici un code test :

Code:

var array = [
    {id:0, html: '<a href="test02">test01</a>'}
];

Code:

array[0].html contient la valeur: <a href="test02">test01</a>

Est-ce que quelqu'un saurait comment faire (au plus simple possible) pour mettre à jour "test02" et "test01" par d'autres données ?
Ou savez-vous si ça porte un nom connu ce genre d'édition de code html venant d'une variable ou d'un array afin d'entamer mes recherches sur Google ?

Merci d'avance,
cordialement

rick38 · 20 Juin 2022

À ce stade là le html est une string, des fonctions de manipulation de chaînes peuvent suffir (chercher la position, remplacer...).
Mais si le html peut varier et être beaucoup plus complexe que ton exemple, genre être une page html, il faut faire du parsing html (chercher "parse html javascript" dans Google) avec un parser, par exemple DOMParser.parseFromString https://www.delftstack.com/howto/javascript/javascript-parse-html/ ou créer l'élément avec
document.createElement puis manipuler le DOM (si JQuery est utilisé, créer l'élément est simple, juste entourer la variable de $( ) ).
Dans tous les cas, ça oblige à copier la variable vers l'objet parser ou l'élément à créer, puis la remettre dans la tableau en écrasant l'ancienne chaîne, ça ne modifie pas "directement" la variable dans le tableau.

ABCWEB · 20 Juin 2022

Code:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Comment modifier un lien hypertexte href en JavaScript ?</title>
</head>
<body>
<a href="https://www.test02.com" id="lien">Aller sur test02.com</a>
<script>
document.getElementById('lien').href ="https://www.test01.com";
document.getElementById("lien").textContent = "Aller sur test01.com";
</script>
</body>
</html>