1. .wrap()方法:在每个匹配的元素外层包上一个html元素。
2. 有两种使用方法:
- .wrap(wrappingElement):其中wrappingElement可以是一个HTML片段,选择表达式,jQuery对象,或者DOM元素,用来包在匹配元素的外层。
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
</head> <body>
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
</body> <script type="text/javascript">
$(function(){
$('.inner').wrap('<div class="new"></div>');
});
</script> </html>浏览器中显示的代码:
- .wrap(function(index)):回调函数,返回用于包裹匹配元素的 HTML 内容或 jQuery 对象。index 参数表示匹配元素在集合中的集合。该函函数内的this
指向集合中的当前元素。
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
</head> <body>
<div class="container">
<div class="inner">Hello</div>
<div class="inner">Goodbye</div>
</div>
</body> <script type="text/javascript">
$(function(){
$('.inner').wrap(function(){
return "<div class='>"+$(this).text()+"<'/div>"
});
});
</script> </html>浏览器中显示的代码:
3. 这个方法还是十分简单的,我在看代码的时候不知道这是个什么方法,但是查阅了API后就知道这个方法的作用了。