Next Lesson

.add() trong jQuery

Định nghĩa và sử dụng .add() trong jQuery

.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 đó.

Cấu trúc .add() trong jQuery

Đã được thêm vào từ phiên bản 1.0

.add(bộ chọn)
------------------------------------------------------------------------------------------
$('div').add('p').css('color','red');
$('div').add('.test, ul li').css('color','red');

.add(html)
------------------------------------------------------------------------------------------
$('div').add('<p class="test">tag p</p>').appendTo('body');

Đã được thêm vào từ phiên bản 1.3.2

.add(Object)
------------------------------------------------------------------------------------------
$('div').add($('p').css('color','red')).css('border','1px solid blue');

Đã được thêm vào từ phiên bản 1.4

.add(bộ chọn,context)
------------------------------------------------------------------------------------------
$('div').add('p',this).addClass('test');

.add(bộ chọn)

Code Html

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
    $('div').add('p').css('border','1px solid blue');
});
</script>
</head>

<body>
<div>Thành phần div</div>
<p>Thành phần p</p>
</body>
</html>

Kết quả:

.add(Object)

Code HTML

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
    $('div').add($('p').css('color','red')).css('border','1px solid blue');
});
</script>
</head>

<body>
<div>Thành phần divdiv</div>
<p>Thành phần p</p>
</body>
</html>

Kết quả:

.add(bộ chọn,context)

Code HTML

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style>
.test {
    background-color: blue;
}
</style>
<script>
$(function(){
    $('div').click(function() {
        $('div').add('p',this).addClass('test');
    });
});
</script>
</head>

<body>
<div>
<p>Thành phần p nằm trong div</p>
</div>
<p>Thành phần p</p>
</body>
</html>

Kết quả:

Click vào div sẽ đổi màu nền

Next Lesson

Preview

Viết câu trả lời

.add() trong jQuery

Định nghĩa và sử dụng .add() trong jQuery

Cấu trúc .add() trong jQuery

.add(bộ chọn)

.add(Object)

.add(bộ chọn,context)

0 Bình luận

Danh mục bài học