recherche

Maison >interface Web >js tutoriel >Comment remplacer les éléments de nœud par jQuery

Comment remplacer les éléments de nœud par jQuery

亚连
亚连original
2018-05-29 15:23:241636parcourir

Cet article explique la méthode de fonctionnement du remplacement des éléments de nœud dans jquery et le code d'implémentation des pages dynamiques à travers un exemple de code. Les amis qui en ont besoin peuvent s'y référer

L'opération de remplacement. éléments de nœud pour réaliser du dynamique Pour la page, le code est le suivant : 

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>中国</title>
 <script type="text/javascript" src="../jquery-3.3.1/jquery-3.3.1.js"></script>
 <script type="text/javascript">
  $(document).ready(function () {
   $("button#button-replaceWith").click(function () {
    $("p").replaceWith("<strong>您好!我最喜欢的IT公司是：</strong>");
    $("[name=&#39;name-replace&#39;]").replaceWith("<tr><td>name-replace</td><td>name-replace</td><td>name-replace</td></tr><tr><td>name-replace</td><td>name-replace</td><td>name-replace</td></tr>");
   });
  });

 </script>
</head>
<body>
 <h2>超实用的jquery代码段-jquery插入节点元素的方法</h2>
 <p>您好！您最喜欢的IT公司是:</p>
 <ul>
  <li title="Google">Google</li>
  <li title="Apple">Apple</li>
  <li title="Microsoft">Microsoft</li>
 </ul>
 <table name="name-replace">

 </table>
 <button id="button-replaceWith">替换节点元素</button>
</body>
</html>

Le rendu est le suivant :

Comme le montre la figure ( 1)

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　

Ce qui précède est ce que j'ai compilé pour vous. J'espère que cela vous sera utile à l'avenir.

Articles associés :

Exemple de code pour vue pour développer un composant bouton

Fichier de configuration sous vue-cli scaffolding-bulid

Un tutoriel simple sur l'utilisation de less dans vue2

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：Explication détaillée d'exemples d'interaction entre Servlet3.0 et JavaScript pur via AjaxArticle suivant：Explication détaillée d'exemples d'interaction entre Servlet3.0 et JavaScript pur via Ajax

Articles Liés

Voir plus