Comment ajouter l'ID à l'élément à l'aide de JavaScript

En JavaScript, le «identifiant«L'attribut est significatif car il identifie un élément spécifique qui peut être trouvé en utilisant le«getElementByid ()" méthode. L'ID dans la page HTML doit être unique car il est utilisé plus tard pour accéder aux valeurs de l'élément HTML et au contenu connexe.

Ce message décrira la procédure pour ajouter un ID à un élément de JavaScript.

Comment ajouter l'ID à l'élément à l'aide de JavaScript?

Pour ajouter l'ID à un élément, le «setAttribute ()"La méthode est utilisée. Il nécessite deux paramètres, le «nom«De l'attribut est le premier paramètre, comme«identifiant»Et sa valeur est un deuxième paramètre, comme«abc".

Syntaxe

L'ID de syntaxe donné utilisé pour la méthode setAttribute ():

élément.setAttribute ("id", "valeur")

Il existe deux façons d'ajouter un ID à un élément de JavaScript:

• Ajouter ID en créant un nouvel élément à l'aide de JavaScript
• Ajouter ID à l'élément HTML existant dans JavaScript

Les exemples donnés démontreront les deux voies une par une!

Exemple 1: Ajouter ID en créant un nouvel élément dans JavaScript à l'aide de la méthode SetAttribute ()

Dans cet exemple, nous créerons une tête HTML par JavaScript et définirons son ID et le texte intérieur pour l'élément DOM.

Dans le fichier JavaScript, créez un élément HTML "h3" en utilisant le "CreateElement ()" méthode:

Const Element = Document.CreateElement ('H3');

Définissez l'ID unique sur la cap en utilisant le «setAttribute ()" méthode:

élément.setAttribute ("id", "titre");

Ici, la méthode prend deux arguments:

• Le "identifiant«Est le premier argument qui est le nom d'attribut.
• Le "titre«Est la valeur de l'ID comme un deuxième attribut.

Obtenez la référence de la balise corporelle HTML en utilisant le «QuerySelector ()" méthode:

Var Body = Document.queySelector («corps»);

Ajouter le titre "h3«Au corps, en utilisant le«APPENDCHILD ()«Méthode en passant l'élément comme argument:

corps.APPEDCHILD (élément);

Maintenant, définissez le texte pour l'élément qui s'affiche sur le DOM en utilisant le «getElementsByTagName ()" avec le "innerhtml" propriété:

document.getElementsByTagName ("H3") [0].innerhtml = "Bienvenue à Linuxhint!"

Sortir

La sortie signifie que l'en-tête est créé avec succès avec son ID qui est défini en utilisant le «setAttribute ()" méthode.

Exemple 2: Ajouter l'ID à l'élément existant à l'aide de la méthode setAttribute ()

Essayons d'ajouter un nouvel ID à l'élément HTML existant dans JavaScript.

Dans un fichier html, créez un titre avec

Étiquette et attribuez-lui un ID en utilisant le «identifiant" attribut:

Bienvenue à Linuxhint!h3>

La sortie HTML correspondante sera:

Maintenant, dans le fichier JavaScript, obtenez d'abord la référence de l'élément en utilisant son ID attribué à l'aide du «getElementByid ()"Méthode et le stocker dans une variable"Définir l'identifiant»:

var setid = document.GetElementById ("Heading");

Définissez le nouvel ID "En-tête1"À l'élément en utilisant le"setAttribute ()" méthode:

Définir l'identifiant.setAttribute ("id", "Heading1");

Sortir

La sortie ci-dessus indique que l'ID de l'en-tête HTML est maintenant «En-tête1"Qui est défini par le javascript"setAttribute ()" méthode.

Conclusion

Pour ajouter un ID à un élément, utilisez le javascript "setAttribute ()" méthode. Il existe deux façons d'ajouter un ID à un élément de JavaScript, d'ajouter un ID en créant un nouvel élément ou ajoutez un ID à l'élément HTML existant dans JavaScript. Ce message a décrit la procédure pour ajouter un ID à un élément de JavaScript.