Maison  >  Article  >  interface Web  >  Comment utiliser innerHTML en JavaScript

Comment utiliser innerHTML en JavaScript

不言
不言original
2018-12-22 11:03:3637344parcourir

L'attribut innerHTML vous permet de modifier le contenu de l'élément html Vous pouvez définir ou renvoyer le code HTML entre les balises de début et de fin de la ligne du tableau. innerHTML.Faisons ceci Voir le contenu spécifique.

Comment utiliser innerHTML en Comment utiliser innerHTML en Comment utiliser innerHTML en JavaScript

Comment écrire innerHTML

Pour l'élément, définissez le nom de l'élément spécifié par innerHTML.

element.innerHTML;

Attribuer le code html de l'élément spécifié à la variable

En écrivant comme suit, on attribue le code html de l'élément spécifié à la variable sample1

var sample1 = element.innerHTML;

Remplacer la valeur de la variable par l'élément spécifié

En écrivant comme suit, vous pouvez afficher le contenu de la variable sample2 sur l'élément element après la suppression le contenu de l'élément element.

element.innerHTML = sample2;

Effacer l'élément spécifié

Vous pouvez effacer le contenu de l'élément élément en spécifiant "".

element.innerHTML = “”;

Regardons un exemple spécifique d'utilisation de innerHTML

Le code de base est le suivant

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
</head>
<body>
<div id="txt">
      <div id="txt1">文字内容1 </div>
      <span id="txt2">文字内容2 </span>
    </div>
    <p>---------------------</p>
    <div id="innerHTMLtxt"></div>
</body>
</html>

Le code en cours d'exécution les résultats sont les suivants

Comment utiliser innerHTML en Comment utiliser innerHTML en Comment utiliser innerHTML en JavaScript

Regardons les résultats de l'utilisation de l'attribut innerHTML

<script type="text/javascript">
		innerHTMLtxt.innerHTML="php中文网!";
	</script>


Les résultats sont comme suit

Comment utiliser innerHTML en Comment utiliser innerHTML en Comment utiliser innerHTML en JavaScript

Ensuite, regardons le code qui utilise innerHTML pour effacer les éléments

<script>
  txt.innerHTML="";
</script>

Les résultats d'exécution sont les suivants

Comment utiliser innerHTML en JavaScript

Cet article est ici. Tout est ici. Pour un contenu plus passionnant, vous pouvez faire attention aux colonnes pertinentes du site Web chinois php ! ! !


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!

Déclaration:
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