- .add(): Thêm thành phần vào thành phần đã có để cùng thực hiện một hành động.
- .add(): Xây dựng một đối tượng jQuery mới (đối tượng này là sự kết hợp của thành phần ban đầu và các thành phần được thêm vào), cùng nhau thực hiện hành động cụ thể nào đó.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
div{
width: 60px;
height: 60px;
margin: 10px;
float: left;
}
p{
clear: left;
font-weight: bold;
font-size: 16px;
color: blue;
margin: 0 10px;
padding: 2px;
}
</style>
<script type="text/javascript" src="jquery-3.4.1.min.js"></script>
</head>
<body>
<!-- ví dụ 1 add từng cái một -->
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<p id="add1">Added this...(ví dụ 1)(notice no border)</p>
<br>
<hr>
<!-- ví dụ 2 add từng gộp nhiều cái -->
<p id="add2">Hello(ví dụ 2)</p>
<span>Hello Again</span>
<br>
<hr>
<!-- ví dụ 3 add thêm dòng span -->
<p id="add3">Hello(ví dụ 3)</p>
<br>
<hr>
<!-- ví dụ 4 add theo getElementById -->
<p class="add4">Hello(Ví dụ 4)</p>
<span id="add4">Hello Again</span>
<br>
<hr>
<!-- ví dụ 5 add theo gán biến -->
<p class="add5">Hello(Ví dụ 5)</p>
<span id="add5">Hello Again</span>
<br>
<hr>
<script type="text/javascript">
/*Ví dụ 1*/
$("div").css("border","2px solid red").add("#add1").css("background","yellow")
/*Ví dụ 2*/
$('#add2').add('span').css("background","green")
/*Ví dụ 3*/
$('#add3').clone().add("<span>Anh Chung dep trai</span>").appendTo(document.body);
/*Ví dụ 4*/
$(".add4").add(document.getElementById("add4")).css("background","yellow")
/*Ví dụ 5*/
var collection = $(".add5");
//Capture the new collection
collection = collection.add(document.getElementById("add5"));
collection.css("background","yellow");
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
div{
width: 60px;
height: 60px;
margin: 10px;
float: left;
}
p{
clear: left;
font-weight: bold;
font-size: 16px;
color: blue;
margin: 0 10px;
padding: 2px;
}
</style>
<script type="text/javascript" src="jquery-3.4.1.min.js"></script>
</head>
<body>
<!-- ví dụ 1 add từng cái một -->
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<p id="add1">Added this...(ví dụ 1)(notice no border)</p>
<br>
<hr>
<!-- ví dụ 2 add từng gộp nhiều cái -->
<p id="add2">Hello(ví dụ 2)</p>
<span>Hello Again</span>
<br>
<hr>
<!-- ví dụ 3 add thêm dòng span -->
<p id="add3">Hello(ví dụ 3)</p>
<br>
<hr>
<!-- ví dụ 4 add theo getElementById -->
<p class="add4">Hello(Ví dụ 4)</p>
<span id="add4">Hello Again</span>
<br>
<hr>
<!-- ví dụ 5 add theo gán biến -->
<p class="add5">Hello(Ví dụ 5)</p>
<span id="add5">Hello Again</span>
<br>
<hr>
<script type="text/javascript">
/*Ví dụ 1*/
$("div").css("border","2px solid red").add("#add1").css("background","yellow")
/*Ví dụ 2*/
$('#add2').add('span').css("background","green")
/*Ví dụ 3*/
$('#add3').clone().add("<span>Anh Chung dep trai</span>").appendTo(document.body);
/*Ví dụ 4*/
$(".add4").add(document.getElementById("add4")).css("background","yellow")
/*Ví dụ 5*/
var collection = $(".add5");
//Capture the new collection
collection = collection.add(document.getElementById("add5"));
collection.css("background","yellow");
</script>
</body>
</html>
ChungBlog 
Leave a comment