Explication détaillée des exemples d'utilisation de la méthode wrapAll() dans jQuery-js tutoriel-php.cn

Explication détaillée des exemples d'utilisation de la méthode wrapAll() dans jQuery

巴扎黑

Libérer： 2017-06-24 14:04:20

original

1115 Les gens l'ont consulté

Cet article présente principalement l'utilisation de la méthode wrapAll() dans jQuery. Il analyse la fonction, la définition et les compétences d'utilisation des éléments correspondants avec des exemples. Les amis dans le besoin peuvent se référer à

Cet article explique les exemples Apprendre. comment utiliser la méthode wrapAll() dans jQuery. Partagez-le avec tout le monde pour votre référence. L'analyse spécifique est la suivante :

Cette méthode enveloppe tous les éléments correspondants avec un seul élément.
Bien que cette méthode ait des fonctions similaires à la méthode wrap(), il existe de grandes différences. La méthode wrap() correspondra une fois à chaque élément correspondant.

Syntaxe 1 :

Enveloppez l'élément correspondant avec l'élément DOM spécifié.

Le code est le suivant :

$(selector).wrapAll(elem)

Liste des paramètres :

Description

Paramètres

参数	描述
elem	用于包裹目标的DOM元素。

elem

Utilisé pour l'élément DOM qui enveloppe la cible.

Exemple :

Le code est le suivant :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="http://www.jb51.net/" />
<head>
<title>脚本之家</title>
<style type="text/css">
    p
   {
       width:200px;
       height:200px;
       border:1px solid blue;
       
margin-top
:10px;
    }
</style>
<script type="text/
javascript
" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
    $(
document
).ready(function(){
        $("button").click(function(){
            $("p").wrapAll(document.getElementById("content"));
        });
    });
</script>
</head>
<body>
    <p>我是个段落</p>
    <p>我是个段落</p>
    <p id="content"></p>
    <button>用p包裹每个段落</button>
</body>
</html>

Copier après la connexion

Syntaxe 2 :

Envelopper la correspondance avec des éléments de code de balise html.

Le code est le suivant :

$(selector).wrapAll(html)

Copier après la connexion

Liste des paramètres :

参数	描述
elem	用于包裹目标的DOM元素。

Exemple :

Le code est le suivant :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="http://www.jb51.net/" />
<head>
<title>脚本之家</title>
<style type="text/css">
    .content
   {
        width:200px;
        height:200px;
        border:1px solid blue;
    }
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("button").click(function(){
            $("p").wrapAll("<p class=&#39;content&#39;></p>");
        });
    });
</script>
</head>
<body>
   <p>这是个段落</p>
   <p>这是个段落</p>
   <button>用p包裹每个段落</button>
</body>
</html>

Copier après la connexion

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!