La méthode JavaScript getElementById sélectionne un élément du Document Object Model (DOM) HTML. Si vous orthographiez mal cette méthode, vous rencontrerez l’erreur document.getElementByID n’est pas une fonction dans votre programme.
Ce tutoriel explique ce que signifie cette erreur et parce qu’elle est soulagé. Nous allons examiner un exemple de cette erreur afin que vous puissiez apprendre ce que vous devez savoir pour la corriger.
document.getElementByID n’est pas une fonction
Le document . La méthode getElementById () est l’une des méthodes de sélection JavaScript. La méthode récupère un objet en fonction de son ID à partir du DOM HTML.
Cette méthode est utilisée pour manipuler le contenu d’un élément ou récupérer des informations sur un élément particulier, comme son contenu ou ses attributs.
Les identifiants sont définis en HTML. Un identifiant doit être unique pour un élément particulier:
document . getElementById () est sensible à la casse. Cette méthode n’est pas:
document. getelementbyid ()
document.getElementByID ()
document.GetElementById ()
Toute autre variation sur le nom de la méthode ne sera pas acceptée par JavaScript .
Bien qu’il soit tentant d’écrire ID en majuscule car c’est l’abréviation d’un autre mot, la méthode nécessite l’utilisation d’une majuscule I et d’une minuscule <. strong> d .
Nous allons construire un extrait de code qui accueille un utilisateur dans notre application. Le message de bienvenue sera dans un titre qui apparaaît en haut de notre page.
Pour les besoins de cet exemple, nous utiliserons un nom de démonstration.
Pour commencer, définissez notre corps de code HTML pour la section d’accueil de la page web:
Par par défaut, notre balise contiendra le contenu Bienvenue. La balise est la balise parente dans Notre titre. Suivant , nous ajouterons une balise sous notre balise . La balise script contiendra tout le code JavaScript pour notre message de bienvenue:
Dans notre script, nous sélectionnerons notre titre et modifierons son contenu:
La méthode getElementById () sélectionne notre titre. Nous attribuons cet élément HTML à la variable JavaScript appelée title. Le contenu de notre titre sera modifié pour afficher "Bienvenue, Luke!" Nous utilisons la méthode textContent pour changer le titre.
Exécutons notre code et voyons ce qui se passe. Si nous ouvrons notre console JavaScript , nous pouvons voir une erreur:
La solution
Nous avons utilisé la mauvaise casse pour le sélecteur document.getElementByID. Au lieu d’utiliser un I majuscule et un d minuscule, nous avons utilisé un I majuscule et un D majuscule. < Br >
JavaScript n’enregistre pas notre programme comme appelant la fonction getElementById car le nom de la fonction est sensible à la casse.
Nous devons changer notre code afin d’utiliser les cas corrects pour notre fonction:
Nous utilisons Id au lieu de ID dans notre appel de fonction. Exécutons notre nouveau code:
Notre programme change avec succès le contenu de notre titre pour inclure notre nom d’utilisateur .
Conclusion < / h2>
La méthode document.getElementById() sélectionne un élément de la page web. Cette méthode vous permet d’afficher et de modifier le contenu d’un élément. Lorsque vous utilisez cette méthode, assurez-vous d’utiliser les casses correctes. L’ID n’est pas tout en majuscules. Vous devez utiliser un I majuscule et un d minuscule pour que la méthode fonctionne.