L'objet DHTML d'IE fournit quatre propriétés lisibles et inscriptibles pour manipuler dynamiquement le contenu des éléments de la page : innerText, externalText, innerHTML, externalHTML
Deux points doivent être notés :
1. Les valeurs des propriétés innerText et externalText sont présentées comme du texte ordinaire. Même s'il contient des balises HTML, il sera reflété fidèlement ; tandis que innerHTML et externalHTML présentent le texte analysé par le moteur HTML, ce qui peut refléter l'effet sur les performances des balises HTML dans les attributs.
2. L'attribution de valeurs aux attributs externalText et externalHTML d'un objet (c'est-à-dire des opérations d'écriture) supprimera l'objet.
L'opération d'affectation des quatre attributs ci-dessus remplace uniquement le contenu textuel de l'objet d'origine. Si vous souhaitez ajouter un nouveau contenu textuel à la position appropriée de l'élément spécifié dans la page, vous devez utiliser les méthodes insertAdjacentHTML et insertAdjacentText. Le formulaire est le suivant :
object.insertAdjacentText(sWhere, sText)
object.insertAdjacentHTML(sOù, sTexte)
Parmi eux, sWhere représente la position du texte inséré par rapport à la balise html. Il a les quatre valeurs prédéfinies suivantes :
beforeBegin, afterBegin, beforeEnd et afterEnd.
Veuillez faire attention aux points suivants lorsque vous les utilisez :
1. Ces deux méthodes doivent être utilisées après le chargement de l'intégralité du document, sinon une erreur se produira.
2. InsertAdjacentText ne peut insérer que du texte ordinaire et InsertAdjacentHTML peut insérer du texte au format HTML
3. Lorsque vous utilisez InsertAdjacentHTML pour insérer un script, vous devez utiliser l'attribut defer dans l'élément script, sinon une erreur d'exécution se produira lors de l'exécution du script
4. Une fois que InsertAdjacentHTML a inséré un élément HTML, toutes les collections d'éléments ainsi que les autres collections d'éléments possibles seront automatiquement mises à jour pour refléter les changements dynamiques. Par exemple, l'attribut sourceIndex des éléments suivants de la page changera.
5. Cette méthode peut provoquer des erreurs d'exécution lors de l'attribution d'attributs InsertHTML/outerHTML à des balises HTML non valides. Par exemple, le code suivant provoquera une erreur :
<BODY>
<p id=pdiv></p>
<SCRIPT LANGUAGE="JavaScript">
pdiv.innerHTML = "<p>hello</p>"
</SCRIPT>
</CORPS>
De plus, les détails suivants doivent être pris en compte lors de l'exploitation dynamique du contenu d'une page :
1. Seul le contenu affiché dans le document BODY peut être modifié dynamiquement par les propriétés et méthodes ci-dessus. Le contenu de l'objet BODY peut être manipulé dynamiquement, mais l'objet BODY lui-même ne peut pas être remplacé.
2. Les attributs et méthodes ci-dessus ne peuvent pas fonctionner sur des balises vides (balises HTML sans contenu), telles que input et img.
3. Pour les objets table, seuls les objets td (innerHTML/innerText) et table (outerHMTL/outerText) peuvent utiliser certains attributs pour remplacer ou insérer du contenu ; d'autres objets table, tels que tr et tbody, ne peuvent pas utiliser ces attributs pour modifier le contenu.