Bạn có thể thêm thuộc tính của riêng mình vào các phần tử HTML không?

Question

Bản sao có thể xảy ra:
Custom attributes - Yay or nay?
Non-Standard Attributes on HTML Tags. Good Thing? Bad Thing? Your Thoughts?

Trong dự án học tập hiện tại tôi đang làm việc trên, tôi cần phải thêm một thuộc tính có giá trị sẽ là một số. Lúc đầu, tôi nghĩ đến việc sử dụng "id" cho mục đích này nhưng an answer tiết lộ rằng không tốt để làm điều đó.

Có OK không nếu tôi tạo thuộc tính của riêng mình, nói "lộn xộn" và gán giá trị bằng số như "12", "6" v.v.

Đây là lý do tại sao tôi muốn làm điều này để bạn có thể sửa tôi nếu tôi làm sai hoàn toàn: Tôi cần truy cập số này trong JavaScript của tôi (sử dụng jQuery). Chỉ cần lấy giá trị của thuộc tính là dễ dàng nhưng việc trích xuất giá trị số từ một chuỗi như "m12" hoặc "m6" là một nỗi đau. (Tôi là người mới bắt đầu trong thế giới JavaScript.)

Answer 1

Đã có rất nhiều cuộc thảo luận về vấn đề này:

• Custom attributes - Yay or nay?
• How to store arbitrary data for some HTML tags
• Non-Standard Attributes on HTML Tags. Good Thing? Bad Thing? Your Thoughts?

Vào cuối ngày, tôi vào trại mà tin thuộc tính dữ liệu cách tốt nhất để đi. Chúng đang được giới thiệu trong HTML5 để tránh xung đột tên. Về cơ bản, nếu bạn muốn để lưu trữ dữ liệu bất cứ điều gì liên quan đến bạn chỉ cần thêm "đĩa dữ liệu" trên tên thuộc tính:

<div class="user" data-userid="5"></div> 

Các con chỉ cho toàn bộ điều là sau đó rằng XHTML của bạn sẽ không xác nhận, nhưng tôi thành thật don không quan tâm đến thứ đó. (Đúng vậy, tôi đã nói)

Answer 2

Không - it's not.

Answer 3

Trong HTML 5, bạn được phép thêm bất kỳ thuộc tính nào bắt đầu bằng data-, vì vậy ví dụ: <div data-messid="12"> là OK.

HTML 4 và XHTML 1 sẽ không xác thực nếu bạn thêm thuộc tính của riêng mình, nhưng bên cạnh đó không có gì xấu xảy ra nếu bạn chọn tên thuộc tính đủ độc đáo (vì vậy nó sẽ không xung đột với bất kỳ thuộc tính HTML hiện tại hoặc tương lai).

Answer 4

Tôi sử dụng các thuộc tính tùy chỉnh và vì chúng được hỗ trợ bởi tất cả các trình duyệt tôi đã kiểm tra, tôi nghĩ rằng không tệ khi sử dụng chúng. Bạn cũng có thể sử dụng thẻ HTML tùy chỉnh để mô phỏng HTML5, với một số hack IE, vậy tại sao không sử dụng các thuộc tính, nếu chúng không cần bất kỳ hack nào?

Dù sao, bạn có thể đọc thảo luận tương tự ở đây: Custom attributes - Yea or nay?

Answer 5

Đây không phải là một câu trả lời dứt khoát, nhưng đã phải làm điều này trong quá khứ tôi có thể nói điều này không chỉ hoạt động tốt, đó là qua trình duyệt thân thiện.

Answer 6

Chỉ cần để bạn biết, bạn có thể dễ dàng trích xuất một ID từ một chuỗi như M12 hoặc m6, tôi sẽ làm điều đó như thế này:

//name the IDs m_12, m_3 etc 
var number = $('#someElement').attr('id').split('_')[1]; 

Hoặc nếu nói rằng, bạn có một loạt các mối liên hệ với các số trong ID như trên, và tất cả các liên kết có lớp clickMe:

$('a.clickMe').click(function() { 
    alert($(this).attr('id').split('_')[1]); 
}); 

Answer 7

Nếu sử dụng jQuery, bạn có thể sử dụng .data để lưu trữ thông tin tùy chỉnh chống lại một phần tử.

Nhược điểm của thuộc tính tùy chỉnh bao gồm:

• IE6 tạo các đối tượng phụ để lưu trữ tùy chỉnh 'expando' thuộc tính này có xu hướng bị rò rỉ đặc biệt nếu chúng được tạo ra thông qua kịch bản.

• xác nhận vấn đề