Maison > Article > interface Web > Comment obtenir du contenu de balise à l'aide de JS

Comment obtenir du contenu de balise à l'aide de JS

php中世界最好的语言original: 2018-06-04 18:00:013025parcourir

Cette fois, je vais vous montrer comment utiliser JS pour obtenir le contenu des balises, et quelles sont les précautions pour utiliser JS pour obtenir le contenu des balises. Ce qui suit est un cas pratique, jetons un coup d'œil.

Dans notre programmation JS quotidienne, nous avons souvent besoin d'obtenir le contenu des balises et d'opérer sur elles. De nombreux détails sont facilement négligés par nous. Je vais maintenant le résumer brièvement en fonction des méthodes que j'utilise habituellement. S'il y a des erreurs, veuillez les corriger.

La structure HTML est la suivante :

<!DOCTYPE  html> <html lang="en"> <head>     <meta charset="UTF-8">     <title>Title</title> </head> <body> <p id="box">     <p>这有个     第一个p</p>     <p>这有个第二个p</p>     <span>这是个         span</span>     <br>     <a href="#">这有个a标签</a> </p>
</body> </html>

Cette méthode peut récupérer tout le contenu de la balise, y compris les balises, les espaces, le texte, les sauts de ligne, etc.
Méthode 1, innerHTML

 <script>
     var box = document.getElementById(&#39;box&#39;);//    获取标签的内容
     var box1 = box.innerHTML;
     console.log(box1);</script>

Le code JS et les rendus sont les suivants :

innerHTML récupère le contenu de la balise

Si vous souhaitez effacer le contenu de la balise, innerHTML = ""; c'est tout

Si vous souhaitez définir le contenu de la balise, innerHTML = "Remplissez la balise et le contenu que vous souhaitez définir" ; définissez le contenu, tout le contenu original sera écrasé.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment utiliser le filtre à l'échelle mondiale

Explication détaillée des cas d'utilisation de la bibliothèque de framework JS

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

Article précédent：Comment ajouter dynamiquement une instance de l'élément Li en javaScriptArticle suivant：Comment ajouter dynamiquement une instance de l'élément Li en javaScript

Articles Liés

Voir plus