Người Viết : ViKiMi Editor
Sử dụng jQuery Method Chaining – Kỹ thuật rất tốt được cung cấp bởi thư viện jQuery
Khi đã quen với thư viện jQuery, bạn sẽ cảm thấy nó rất thân thiện. Không chỉ đem lại cho bạn một cảm giác giống như được làm việc ngắn gọn, tiết kiệm thời gian. Thư viện jQuery còn mang lại nhiều điều mới ngạc nhiên, khả năng mà jQuery mang lại có thể bạn cũng chưa hề gặp ở một ngôn ngữ lập trình nào khác. Chính điều này làm nên sự mới mẻ!
Chúng ta còn có thể tìm được điều gì mới mẻ hơn nữa?
Chắc chắn rồi Thư viện jQuery đã cho chúng ta điều này.
Về mặt lý thuyết mà nói điều này khá là ngạc nhiên. Vì Thư viện jQuery cho phép bạn thực thi nhiều Actions / Methods trên cùng một phần tử chỉ bằng một lệnh. Cổ điển trong các ngôn ngữ lập trình thì điều này rất ít được cung cấp cho các Nhà Phát Triển, Lập trình viên.
Vậy điều này được gọi là gì ?
+ Câu trả lời : jQuery Method Chaining
Thư viện jQuery cho phép thực thi xâu chuỗi các Actions / Methods trên một phần tử HTML lại với nhau trong một câu lệnh.
Example ::
$(“#article-title”).html(“jQuery – Chaining”).slideToggle();
Từ trước tới nay chắc hẳn chúng ta quen với việc chạy từng Action / Method trên một dòng lệnh. Tuy nhiên, nhờ kỹ thuật mới là Xâu chuỗi / Chaining của Thư viện jQuery, đã có thể thực thi nhiều Actions / Methods trên một phần tử HTML chỉ bằng một lệnh.
Kỹ thuật mới này cho phép chúng ta có được một chương trình nhanh hơn.
Nguyên nhân, Chương trình sẽ không tốn nhiều thời gian để tìm một phần tử nhiều lần. Thay vào đó nó sẽ chỉ tìm một lần duy nhất và sẽ thực thi các Actions / Methods trên phần tử tìm được.
<!DOCTYPE html>
<html>
<head>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js”></script>
<script>
$(document).ready(function(){
$(“button”).click(function(){
$( “#article-title” ).html( “jQuery – Chaining” ).css( “color”, “green” ).slideToggle( );
});
});
</script>
</head>
<body>
<p id=”article-title”> jQuery Library !! </p>
<button> Get article title </button>
</body>
</html>
Chúng ta cũng có thể xâu chuỗi nhiều Actions / Methods khi cần.
Nếu bạn gặp trường hợp quá dài thì vẫn có thể ngắt dòng – xuống dòng. Vì jQuery sẽ tự động biên dịch để loại bỏ khoảng trắng thừa và thực thi các dòng lệnh dưới dạng một mã lệnh dài.
Example ::
$( “#article-title” ).html( “jQuery – Chaining” )
.css( “color”, “green” )
.slideToggle( );
+ Kỹ thuật Chaining / Xâu chuỗi được cung cấp bởi jQuery khá thú vị
+ Đây cũng là một kỹ thuật đáng ưu tiên khi lập trình
