Người Viết : ViKiMi Editor

Khái niệm jQuery Labels thực sự hiệu quả và mang lại mới mẻ khi sử dụng cùng Break, Continue
Sử dụng câu lệnh Break và Continue đem lại cho chúng ta nhiều cách làm mới hơn. Tất nhiên đây chính là cách giúp chúng ta cảm thấy lập trình không còn quá khô cứng. Làm việc với Break và Continue dường như là điều mà chúng ta nên làm quen và làm chủ trong tình huống khác nhau. Để bổ sung cho điều này, trong phần mới chúng ta sẽ có một cách làm việc hiệu quả hơn.
jQuery là một thư viện được phát triển và có tất cả những gì chúng ta cần.
Làm quen với jQuery là cách chúng ta có một cách nhanh nhất giải quyết mọi vấn đề.
Thư viện jQuery đã được sử dụng nhiều năm qua và được ưa chuộng.
Phần này chúng ta sẽ làm quen với khái niệm Label trong jQuery.
Label là một trong những khái niệm có vẻ lạ nhưng thực ra rất quen với mọi Lập trình viên. Khái niệm Label đã được dùng trong mọi ngôn ngữ lập trình, nó cũng được jQuery cung cấp. Khi được dùng trong jQuery và kết hợp với Break, Continue thì khái niệm Label cho chúng ta một cảm giác mới.
Vậy điều này như thế nào?
Chúng ta sẽ làm quen với khái niệm mới này.
jQuery Labels
Để tạo nhãn cho các câu lệnh sử dụng bởi jQuery, bạn đặt trước các câu lệnh bằng tên nhãn và dấu hai chấm ‘ : ’
label:
statements
Việc tạo nhãn với jQuery cũng sẽ được áp dụng để kết hợp với câu lệnh Break và Continue.
Điều này tạo ra một thuận lợi đó là chúng ta có thể tạo ra một khối lệnh trong chương trình, đồng thời cũng có thể quyết định thoát khỏi khối lệnh này khi nào dựa vào break và continue.
Một ví dụ đơn giản giúp chúng ta dễ dàng thấy rõ hơn.
Ví dụ 1 :
+ Tạo nhãn khối lệnh 1
+ Thoát khỏi khối lệnh 1 khi thoả mãn j == 3
Fragment1: { element_2.css("font-size", "25px"); if( j == 3 ) { break Fragment1; } if( var_2 == "Get Coupons" ){ // Do something } }
Như vậy, chúng ta thấy rằng trong ví dụ 1 khi giá trị j == 3 thì chương trình sẽ thoát khỏi khối lệnh được tạo với nhãn Fragment1. Thật hữu ích vì chúng ta không chỉ dùng Break và Continue để thoát khỏi một lệnh vòng lặp. Chúng ta còn có thể tạo một khối lệnh bằng jQuery Labels và sử dụng Break, Continue để thoát ra khỏi khối lệnh đó.
Điều này giúp chúng ta có một tường minh khi lập trình.
Để xem một ví dụ rõ hơn, chúng ta có thể tham khảo chương trình đầy đủ sau đây :
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
var j =0;
var element_2, var_2;
var couponElements = $(".product_coupon");
for( j = 0; j < couponElements.length; j++ ) {
if( j== 0 ){
$("#welcome_to_Bee").html("Greeting Customers <b> In BEE SHOP </b>");
}
element_2 = couponElements.eq(j);
var_2 = element_2.text();
Fragment1: {
element_2.css("font-size", "25px");
if( j == 3 ) { break Fragment1; }
if( var_2 == "Get Coupons" ){
element_2.css("background-color", "red");
element_2.css("opacity", "0.8");
element_2.css("font-size", "20px");
}
}
}
});
});
</script>
</head>
<body>
<p id="welcome_to_Bee"> Loading ... </p>
<p id="test">These are products <b>in Bee Shop</b> .</p>
<table class="tbl_company" border="1">
<tr>
<th>Product</th>
<th>Price</th>
<th>Coupons</th>
</tr>
<tr>
<td>Quần Áo</td>
<td><p class="price_product">SALE 200000</p></td>
<td class="product_coupon">Get Coupons</td>
</tr>
<tr>
<td>Giày Dép</td>
<td><p class="price_product">SALE 300000</p></td>
<td class="product_coupon">No Coupons</td>
</tr>
<tr>
<td>Trang Sức</td>
<td><p class="price_product">SALE 150000</p></td>
<td class="product_coupon">Get Coupons</td>
</tr>
</table>
<br/>
<button id="btn1">Best Sale</button>
</body>
</html>
Chúng ta có thể tổng kết lại rằng jQuery Labels cho phép chúng ta tạo ra nhãn khi lập trình với jQuery. Chúng ta cũng có thể tạo ra một khối lệnh để giúp chương trình trở nên khoa học và tường minh hơn.
Nhờ jQuery Labels có thể kết hợp với Break và Continue nên chúng ta thật đơn giản để thoát ra khỏi khối lệnh được tạo ra. Và tổng kết điều này chúng ta có thể hiểu :
+ Câu lệnh break và continue là những câu lệnh có thể giúp “nhảy ra khỏi” một khối mã.
break labelname;
continue labelname;