Nếu bạn đã đọc bài viết gần đây của tôi về “HTML lớp là gì?” . Bài viết này sẽ giải đáp câu trả lời đó và cung cấp cho bạn một vài hướng dẫn khi sử dụng id trong HTML
Các thuộc tính được thêm vào các phần tử trong tài liệu HTML để tạo điều kiện tạo kiểu thông qua các tệp CSS hoặc thêm chức năng thông qua Javascript. Thuộc tính mà bạn sẽ thấy thường xuyên nhất là thuộc tính lớp, nhưng thỉnh thoảng bạn có thể bắt gặp thuộc tính “id”
Thuộc tính “id” khác với thuộc tính lớp vì nó là duy nhất cho một tài liệu. Nếu bạn muốn một kiểu áp dụng cho một thành phần trên trang, bạn nên sử dụng “id”. Nếu bạn muốn áp dụng một kiểu cho nhiều phần tử trên một trang, bạn nên sử dụng thuộc tính lớp
Biết khi nào nên sử dụng “id” hoặc lớp trong HTML chỉ là một phần lý do tại sao id tồn tại. Chúng có các chức năng và quy tắc khác áp dụng cho chúng mà bạn có thể tìm thấy bên dưới
Mục lục
Tôi có thể thêm ID vào những yếu tố nào?
Nếu bạn đã quyết định bắt đầu học HTML vào năm 2022, giống như tôi, thì có lẽ bạn đã bắt đầu học HTML5
In HTML5, the “id” attribute can be applied to any HTML tag or element, including tags like the and , which is one of the differences between HTML5 and its predecessor.
Tôi có thể sử dụng cùng một id bao nhiêu lần trên một trang?
Một "id" được yêu cầu là duy nhất trên một tài liệu. Điều này có nghĩa là bạn chỉ có thể có một “id” trùng tên trên tài liệu
Tôi nhận thấy rằng không bao giờ có lý do chính đáng để sử dụng cùng một “id” trên một trang nhiều lần. “Id” là mã định danh duy nhất cho một phân đoạn trang. Thuộc tính lớp nên được sử dụng khi bạn muốn áp dụng cùng một kiểu cho một số thành phần trên một trang
Quy tắc thuộc tính id HTML
Ba quy tắc chính áp dụng cho thuộc tính “id”
Thứ nhất, thuộc tính “id” phải là duy nhất cho tài liệu. Thuộc tính “id” phải bắt đầu bằng một chữ cái, có thể là chữ hoa hoặc chữ thường. Các ký tự tiếp theo có thể là chữ cái, số, dấu gạch nối, dấu gạch dưới, dấu hai chấm và dấu chấm
Tại sao sử dụng thuộc tính id trên lớp?
Nếu bạn chỉ mới bắt đầu hành trình viết mã của mình, bạn sẽ không sai khi đặt câu hỏi này bởi vì thoạt nhìn, có vẻ như id và lớp giống nhau, nhưng id có vẻ hạn chế hơn, vậy tại sao lại sử dụng “id”
Một trong những lý do chính để sử dụng thuộc tính “is” là vì JavaScript có phương thức “getElementById”. Gọi phương thức này trong JavaScript sẽ cho phép bạn chọn và áp dụng tập lệnh cho một thành phần duy nhất trong tài liệu của mình
Một phần tử có thể có “ID” và thuộc tính lớp không?
Có, các phần tử HTML có thể có thuộc tính “id” và lớp. Khi cả hai thuộc tính được gán, thuộc tính lớp có khả năng áp dụng kiểu CSS trong khi thuộc tính “id” đang áp dụng tập lệnh cho phần tử
Phần kết luận
Mặc dù id và class thoạt nhìn có vẻ giống nhau, nhưng bạn sẽ nhanh chóng thấy rằng chúng phục vụ một mục đích nào đó khi bạn bắt đầu làm việc với JavaScript
Bạn có biết sự khác biệt giữa class và id và khi nào bạn nên sử dụng id hoặc class trong HTML không?
Tôi hy vọng bài viết này đã truyền cảm hứng cho bạn thực hiện bước nhảy vọt đó và bắt đầu học viết mã. Nhấp vào đây để gặp gỡ các lập trình viên mới khác như bạn và tham gia cộng đồng của chúng tôi
Chúng tôi cần các cách để mô tả nội dung trong tài liệu HTML/XHTML. Các phần tử cơ bản như ,
Chúng ta đã biết phần tử này là một liên kết, nó là một phần tử neo. Ở đây không có nhu cầu cụ thể để áp dụng một lớp, vì chúng ta đã có thể áp dụng kiểu dáng thông qua thẻ của nó
Cũng nên tránh điều này
________số 8ID được sử dụng phù hợp ở đây vì trang có thể sẽ chỉ có một cột bên phải, nhưng tên không phù hợp. Hãy thử và mô tả ngữ cảnh của phần tử, không phải vị trí của phần tử đó hoặc phần tử đó trông như thế nào. Một ID ở đây là “thanh bên” sẽ phù hợp hơn
Microformats chỉ là tên lớp cụ thể
Nghĩ rằng vi định dạng là trên đầu của bạn? . Chúng chỉ là phần đánh dấu thông thường sử dụng tên lớp được tiêu chuẩn hóa cho thông tin mà chúng chứa. Kiểm tra một vCard tiêu chuẩn