Example analysis of remove() method usage in jQuery-JS Tutorial-php.cn

Example analysis of remove() method usage in jQuery

巴扎黑

Release： 2017-06-25 09:49:31

Original

1116 people have browsed it

This article mainly introduces the usage of remove() method in jQuery, and demonstrates the use skills of remove() method to delete elements in three different examples. It has It has certain reference value. Friends who need it can refer to it

The example in this article describes the usage of the remove() method in jQuery. Share it with everyone for your reference. The specific analysis is as follows:

This method will delete all matching elements from the DOM.

Note:The remove() method does not delete the matching elements from the jQuery object, so these matching elements can be used again in the future, but except for the element itself, it is retained , others such as bound events, additional data, etc. will be removed.

Grammar structure:

The code is as follows:

$(selector).remove(expr)

Parameter list:

Parameter	Description
expr	Optional. jQueryexpression for filtering elements

##Example code:

Example one:

The code is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>remove()
函数
-脚本之家</title>
<script type="text/
javascript
" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(
document
).ready(function(){
  $("button").click(function(){
    $("p").remove("#first");
  })
})
</script> 
</head>
<body>
<p id="first">我是第一</p>
<p id="second">我是第二</p>
<button>点击</button>
</body>
</html>

Copy after login

The following code can delete p whose id is first in the p collection.

Example 2:

The code is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>remove()函数-脚本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){
  $("#btd").click(function(){
    $("p").remove();
  })
})
</script> 
</head>
<body>
<p id="first">我是第一</p>
<p id="second">我是第二</p>
<button id="btd">点击删除第一个p</button>
</body>
</html>

Copy after login

If the parameters are omitted, all matching elements will be deleted.

Example 3:

The code is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title>remove()函数-脚本之家</title>
<style type="text/css">
p{
  width:200px;
  height:200px;
  border:5px solid green;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){
  $("#btd").click(function(){
    var a=$("p");
    a.remove("#first");
    $("#btn").click(function(){
      alert(a.length);
    })
  })
})
</script> 
</head>
<body>
<p id="first">我是第一</p>
<p id="second">我是第二</p>
<button id="btd">删除第一个p</button><button id="btn">查看删除操作后p的数量</button>
</body>
</html>

Copy after login

remove() has deleted the matching element in the DOM, but it has not deleted it from the jquery object .

The above is the detailed content of Example analysis of remove() method usage in jQuery. For more information, please follow other related articles on the PHP Chinese website!