Maison > interface Web > js tutoriel > Comment puis-je remplacer le contenu d'un élément HTML à l'aide de JavaScript et de noms de classe ?

Comment puis-je remplacer le contenu d'un élément HTML à l'aide de JavaScript et de noms de classe ?

Barbara Streisand
Libérer: 2024-12-05 07:24:13
original
810 Les gens l'ont consulté

How Can I Replace HTML Element Content Using JavaScript and Class Names?

Comment accéder et modifier des éléments HTML par classe en JavaScript

L'obtention d'éléments par classe en JavaScript diffère de l'utilisation d'ID en raison du manque de JavaScript une fonction intégrée à cet effet. Cependant, une solution de contournement peut être mise en œuvre.

Pour modifier le contenu d'un élément HTML à l'aide d'une classe au lieu d'un identifiant, vous pouvez utiliser le code suivant :

function replaceContentInContainer(matchClass, content) {
    var elems = document.getElementsByTagName('*'), i;
    for (i in elems) {
        if((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ')
                > -1) {
            elems[i].innerHTML = content;
        }
    }
}
Copier après la connexion

Ce code parcourt tous les éléments du document et vérifie si leur liste de classes contient le matchClass spécifié. Lorsqu'il trouve une correspondance, il remplace le contenu de cet élément par le paramètre de contenu fourni.

Cette approche garantit la compatibilité entre les navigateurs. Voici un exemple pratique :

replaceContentInContainer('box', 'This is the replacement text');
Copier après la connexion
<div class='box'></div>
Copier après la connexion

Ce code remplace le contenu du

avec le texte spécifié.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal