Label là gì?

Trong chương trình xử lý bảng tính (spreadsheet), chẳng hạn như Microsoft Excel, nhãn (label) là văn bản trong một ô (cell), thường mô tả dữ liệu trong các hàng hoặc cột xung quanh nó.

Trong lập trình, label là một điểm tham chiếu hoặc lệnh được sử dụng để di chuyển trong suốt chương trình. Xem định nghĩa goto để biết ví dụ về cách sử dụng này.

Khi đề cập đến biểu đồ (chart), nhãn (label) là bất kỳ văn bản nào trên một phần của biểu đồ cung cấp thông tin bổ sung về giá trị biểu đồ. Ví dụ: trong biểu đồ tròn (pie chart), mỗi phần của biểu đồ tròn được gắn nhãn để cung cấp giá trị của mỗi phần trăm.

Nhãn (label) là thứ chúng ta đang dự đoán — biến y trong hồi quy tuyến tính (linear regression) đơn giản. Nhãn có thể là giá lúa mì trong tương lai, loại động vật được hiển thị trong hình ảnh, ý nghĩa của đoạn âm thanh hoặc bất cứ điều gì.

Khi tạo biểu mẫu (form) bằng HTML, bạn có thể quyết định rằng bạn muốn thêm chú thích (caption) / nhãn (label) vào các trường (field) bên trong biểu mẫu HTML. Ví dụ: bạn có thể muốn một trường biểu mẫu yêu cầu tên của khách hàng có chú thích Forename:. Để làm được điều này chúng ta sử dụng thẻ (tag) <label>. Thẻ <label> được sử dụng để xác định chú thích cho phần tử điều khiển (control element) của biểu mẫu trong một biểu mẫu HTML. Mỗi nhãn được liên kết với một phần tử cụ thể trong một biểu mẫu thông qua thuộc tính (attribute) for.

Trong hình bên dưới ta có chú thích / nhãn tên First name được tạo bằng cách sử dụng thẻ <label>

Có một vài lý do tại sao việc sử dụng thẻ <label> lại quan trọng. Đầu tiên, thẻ <label> được liên kết với một trường của biểu mẫu cụ thể trên một trang web. Điều này có nghĩa là, nếu trình đọc màn hình (screen reader) gặp trường của biểu mẫu, nội dung của thẻ <label> bạn chỉ định sẽ được đọc cho người dùng. Điều này làm cho trang web của bạn dễ tiếp cận hơn.

Ngoài ra, khi thẻ <label> được liên kết với trường của biểu mẫu, người dùng có thể nhấp vào văn bản trong thẻ <label> để kích hoạt trường của biểu mẫu. Điều này giúp người dùng bắt đầu tương tác với trường của biểu mẫu dễ dàng hơn vì họ không phải nhấp trực tiếp vào phần tử (element). Ví dụ: nếu bạn có một phần tử checkbox không có thẻ <label>, người dùng sẽ phải nhấp trực tiếp vào bên trong checkbox để kích hoạt phần tử. Tuy nhiên, nếu bạn chỉ định thẻ <label>, người dùng cũng có thể nhấp vào nội dung của thẻ <label> đó để kích hoạt checkbox.

Cú pháp:

Cú pháp cho thẻ <label> như sau:

<label for="id">Label contents</label>

Thuộc tính for được sử dụng để liên kết thẻ <label> với một phần tử <input> cụ thể. Giá trị của thuộc tính for phải bằng thuộc tính id của phần tử <input> sử dụng thẻ <label> này.

Bạn cũng có thể đặt phần tử <input> bên trong thẻ <label> để liên kết <input> với <label>, thay vì sử dụng thuộc tính for. Cú pháp cho điều này như sau:

<label>Label contents
	<input type="text">
</label>