1. Método
wrap: envolve todos os elementos correspondentes com a estrutura de outros elementos
wrapAll: envolve todos os elementos correspondentes com um único elemento
wrapInner: envolve a subclasse do elemento correspondente com uma estrutura html
2. Exemplos
(1) embrulhar
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script type="text/javascript" src="../jquery-2.0.0/jquery-2.0.0.js"></script>
<script type="texto/javascript">
$(função(){
$("div a").wrap("<div id='id'></div>");
});
</script>
</head>
<corpo>
<div>
<a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a>
</div>
</body>
</html>
firebug exibe os resultados:
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript">
<script type="texto/javascript">
</head>
<corpo>
<div>
<divid="id">
<a>liuxingyu</a>
</div>
<divid="id">
<a>liuxingyu</a>
</div>
<divid="id">
<a>liuxingyu</a>
</div>
<divid="id">
<a>liuxingyu</a>
</div>
</div>
</body>
</html>
(2) embrulhar tudo
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script type="text/javascript" src="../jquery-2.0.0/jquery-2.0.0.js"></script>
<script type="texto/javascript">
$(função(){
$("div a").wrapAll("<div id='id'></div>");
});
</script>
</head>
<corpo>
<div>
<a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a>
</div>
</body>
</html>
firebug exibe os resultados:
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript">
<script type="texto/javascript">
$(função(){
$("div a").wrapAll("<div id='id'></div>");
});
</script>
</head>
<corpo>
<div>
<divid="id">
<a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a>
</div>
</div>
</body>
</html>
(3) embrulho interno
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript">
<script type="texto/javascript">
$(função(){
$("div").wrapInner("<div id='id'></div>");
});
</script>
</head>
<corpo>
<div>
<a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a>
</div>
</body>
</html>
firebug exibe os resultados:
Copie o código do código da seguinte forma:
<!DOCTYPEhtml>
<html>
<cabeça>
<meta charset="UTF-8">
<title>Insira o título aqui</title>
<script src="../jquery-2.0.0/jquery-2.0.0.js" type="text/javascript">
<script type="texto/javascript">
$(função(){
$("div").wrapInner("<div id='id'></div>");
});
</script>
</head>
<corpo>
<div>
<divid="id">
<a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a> <a>liuxingyu</a>
</div>
</div>
</body>
</html>