Buzz
Thuộc tính ID chỉ định một định danh duy nhất cho phần tử HTML (giá trị này phải là duy nhất trong tài liệu HTML). Đọc tiếp bài viết dưới đây của Mytour để hiểu rõ hơn về chi tiết của thuộc tính ID trong HTML.
Khám phá chi tiết về thuộc tính ID trong HTML
1. Hiểu rõ Thuộc tính id trong HTML
2. Sự khác biệt giữa Thuộc tính class và id trong HTML là gì?
3. Hướng dẫn Tạo bookmark trong HTML
4. Ứng dụng Thuộc tính id trong JavaScript
1. Hiểu rõ về Thuộc tính id trong HTML
CSS và JavaScript có khả năng sử dụng giá trị id để thực hiện nhiều tác vụ cụ thể cho phần tử với id được xác định.
Trong CSS, để chọn phần tử có id cụ thể, chúng ta sử dụng ký tự (#), sau đó là id của phần tử đó.
Một ví dụ: Trong ví dụ này, chúng ta áp dụng CSS để xác định phần tử có id là 'Mytour':
Kết quả trả về sẽ hiển thị như sau:
Chú ý:
- Thuộc tính id có thể áp dụng cho bất kỳ phần tử HTML nào.
- Id cần được viết in hoa.
- Id phải bao gồm ít nhất một ký tự và không có khoảng trắng (dấu cách, tab, ...).
2. Sự khác biệt giữa thuộc tính class và id trong HTML
Mỗi phần tử HTML chỉ có một id duy nhất, ngược lại, một tên lớp có thể được sử dụng bởi nhiều phần tử khác nhau.
Một ví dụ: Tham khảo ví dụ sau để hiểu sự khác biệt giữa thuộc tính class và id trong HTML:
Kết quả trả về sẽ có dạng như sau:
3. Hướng dẫn tạo bookmark trong HTML
Bookmark trong HTML giúp người đọc dễ dàng chuyển đến các phần cụ thể trên trang web.
Bookmark đặc biệt hữu ích, đặc biệt là trên các trang web có nhiều nội dung.
Để tạo bookmark trong HTML, đầu tiên chúng ta cần tạo một điểm đánh dấu, sau đó thêm liên kết cho điểm đánh dấu đó.
Khi người dùng nhấp vào liên kết, trang sẽ tự động cuộn đến vị trí đã đánh dấu.
Một ví dụ: Trong ví dụ dưới đây, chúng ta sẽ tạo một bookmark trong HTML:
Đầu tiên, chúng ta sử dụng thuộc tính id để tạo bookmark:
Bước tiếp theo là thêm liên kết vào bookmark (nhảy đến chương 4) trên cùng một trang:
Hoặc thêm liên kết vào bookmark (nhảy đến chương 4) từ trang khác:
Kết quả trả về sẽ có dạng như sau:
4. Sử dụng thuộc tính id trong JavaScript
JavaScript có khả năng truy cập một phần tử dựa trên id sử dụng phương thức getElementById().
Một ví dụ: Trong ví dụ dưới đây, chúng ta sử dụng thuộc tính id để thực hiện thao tác với văn bản bằng JavaScript:
Kết quả trả về sẽ có dạng như sau:
Trên đây là bài viết của Mytour giới thiệu về thuộc tính id trong HTML. Nếu có thắc mắc hoặc câu hỏi gì, bạn đọc hãy chia sẻ ý kiến của mình trong phần bình luận dưới bài viết.
Trong bài viết tiếp theo, Mytour sẽ tiếp tục giới thiệu về thuộc tính màu trong HTML.
