Comment accéder à des éléments de programme en javascript html

Si vous voulez changer le contenu, la présentation ou l'interaction, vous devez avoir accès à un élément HTML personne de le faire. Par exemple, si vous voulez changer la légende sur un bouton, vous devez avoir accès au premier bouton.

Sommaire

  • Comment modifier le flux de sortie

    Pensez à un flux physique lors de l'examen des flux dans un système informatique. Dans un flux physiques, des atomes individuels de débit d'eau d'un endroit à l'autre le long d'un chemin spécifique. De même, dans un courant d'ordinateur, des bits individuels des flux de données d'un endroit à un autre le long d'un chemin spécifique.

    La modification du flux de sortie des moyens pour modifier le flux de données dans le chemin. Vous pouvez endiguer le flux par la fermeture du flux, ajouter un nouveau flux en lui écrivant, ou permettre le flux de données en ouvrant le flux. La liste suivante décrit les fonctions associées au flux de sortie:

    • Fermer(): Ferme un flux de sortie qui a été ouvert en utilisant le open () Procédé.

    • open (): Ouvre un nouveau flux de sortie pour recevoir le contenu soit de la écrire() ou writeln () fonction.

    • écrire(): Affiche le texte que vous fournissez au courant actuellement ouvert.

    • writeln (): Affiche le texte que vous fournissez au courant actuellement ouverte et se termine la sortie avec un caractère de nouvelle ligne, ce qui rend la sortie plus facile à voir lors de l'affichage de la source de la page dans un navigateur.

    Ces quatre fonctions permettent de modifier le flux de sortie. Voici un exemple qui combine la modification des cours d'eau avec quelques autres concepts.




    Le document comprend un exemple tag qui définit le formatage pour divers éléments. Bien sûr, il serait bon de savoir comment la page est formatée. Chaque tag associé à une page est un élément de la styleSheets la propriété, auquel vous pouvez accéder en utilisant un index.

    Cette page n'a qu'un seul tag de sorte que le code accède à l'aide du styleSheets [0] index. Chaque style CSS a une ou plusieurs règles définies pour elle, que vous pouvez accéder à l'aide de la cssRules propriété.

    À ce stade, l'exemple repose sur une imbriqué pour boucle pour déterminer le nom de la règle et chacun des styles définis dans la règle. Une propriété de style se compose d'un nom du style et une valeur de style. Vous devez utiliser le nom de la propriété de style pour accéder à la valeur en utilisant le getPropertyValue () Procédé.

    image0.jpg

    Vous pouvez utiliser les différentes méthodes et propriétés associées à la styleSheets propriété et de ses enfants à modifier les styles ainsi que les lire.

    Comment influer sur le contenu HTML

    La raison pour afficher une page est de fournir du contenu pour le spectateur. Il peut sembler comme si les pages sont tous sur le formatage, graphiques, éléments de conception, et ainsi de suite, mais ces éléments sont étalages pour le contenu que la page fournit. L'exemple suivant montre quelques techniques simples pour changer le contenu sur une page.

    ChangeContent fonction () {// Modification du 

    tag.document.getElementById ("Évolution1") innerHTML = "changé!" -. // Modifier le tag.document.getElementById ("btnChange") setAttribute ("valeur", "clicked") -.}

    Même si cet exemple semble simple, il contient tout le nécessaire pour modifier le contenu dans presque toutes les situations. Lorsque l'on travaille avec un élément HTML, comme le

    tag, vous utilisez le innerHTML la propriété de faire des changements. Cette technique fonctionne aussi bien sur

    , , et

    balises.

    Comment modifier les attributs HTML

    Chaque balise HTML peut comporter deux types d'information: contenu qui apparaît entre le début et la fin de l'étiquette et attributs. Le contenu prend habituellement la forme de texte, mais il peut aussi inclure un objet, comme une image, un lien vers une vidéo ou un son. La plupart des attributs besoin d'informations spécifiques. Vous pouvez généralement diviser attributs dans les catégories suivantes:

    • Contenu: Définit les informations qui apparaissent à l'écran pour le spectateur.

    • Mise en forme: Modifie la façon dont l'information apparaît à l'écran. Par exemple, il pourrait ajouter des couleurs spéciales ou de modifier l'apparence de la police utilisée pour afficher le texte.

    • Contrôle: Spécifie la manière dont un utilisateur peut interagir avec le contenu. Par exemple, vous pouvez décider que une zone de texte permettra au spectateur seulement de lire le contenu plutôt que lire et écrire.

    • Numéro d'identification: Fournit une description ou tout autre identifiant à d'autres contrôles ou javascript, de sorte que ces autres entités peuvent identifier de manière unique le contrôle de l'hôte.

    • Événement: Détermine la fonction utilisée pour gérer l'événement spécifique, tel qu'un clic de l'utilisateur ou le changement de contenu.

    L'exemple suivant montre comment modifier divers attributs d'une page.

    fonctionne EnableButton () {// Reconfigurer btnSecond.var Button2 = document.getElementById("btnSecond")-Button2.removeAttribute("disabled")-Button2.setAttribute("value", "Changer contenu") -} function ChangeP1 () {// Maintenant que le deuxième bouton est activé, utilisez // pour changer la 

    tag style.var P1 = document.getElementById ("P1") - P1.setAttribute («classe», «spéciale») -}

    Cet exemple comporte deux boutons. Au départ, le premier bouton est désactivé. Pour rendre le bouton fonctionnel, l'utilisateur clique sur le premier bouton, qui appelle EnableButton (). Pour activer le bouton, le code supprime la désactivée attribuer. La légende pour le deuxième bouton est incorrect à ce point. Il dit actuellement désactivé, afin que le code modifie également la valeur attribuer à Modifier le contenu.

    Maintenant que le deuxième bouton est activé et a le droit de légende, l'utilisateur peut cliquer dessus. La

    tag utilise actuellement le style CSS par défaut pour ce tag. Pour changer le style de texte, le code ajoute un classe attribuer l'aide setAttribute () et définit la valeur de spécial. L'ajout de la classe attribut change automatiquement la forme de texte.

    image1.jpg

    » » » » Comment accéder à des éléments de programme en javascript html