Tôi có thể lưu trữ các thuộc tính tùy chỉnh trong HTML DOM như bản ghi cơ sở dữ liệu không?

Question

Khi phát triển cho các trình duyệt FF3 và IE6/7 với jQuery, có bất kỳ vấn đề tương thích nào khi thiết lập các thuộc tính tùy chỉnh trên các thẻ HTML không?

Trước tiên, tôi biết về chức năng data() của jQuery và về cơ bản nó thực hiện những gì tôi muốn, nhưng dữ liệu không tồn tại chức năng clone(). Đây là vấn đề khi sử dụng các plugin jQuery có thể kéo/có thể tháo rời vì nó nhân bản các phần tử DOM trong khi kéo/thả. Vì mục đích của câu hỏi này, tôi cần một giải pháp thay thế cho data().

Tôi muốn lưu giữ dữ liệu giữa các thao tác kéo/thả. Tôi muốn có thể chèn dữ liệu vào phần tử DOM được di chuyển trong quá trình kéo/thả. Để làm điều này, tôi có thể xây dựng các phần tử con HTML để mô phỏng một bản ghi cơ sở dữ liệu. Thử nghiệm nhanh cho thấy Firefox không có vấn đề gì khi sử dụng bất kỳ tên thuộc tính nào mà tôi muốn lưu trữ các trường dữ liệu. Tuy nhiên, thông số HTML 4 cho biết rằng các thẻ nhất định chỉ có thể chứa các tên thuộc tính nhất định. Sẽ điền DOM với các thuộc tính không chuẩn gây ra các vấn đề không tương thích với các trình duyệt tôi đã đề cập?

Answer 1

Hãy nhìn vào câu hỏi tương tự này, tôi hỏi một trong khi quay lại: Can I just make up attributes on my HTML tags?

Cá nhân, tôi thực sự không thích các câu trả lời được đề xuất để đưa tất cả dữ liệu của bạn vào thuộc tính lớp. Nó cảm thấy, chỉ ... sai bạn biết? Theo kinh nghiệm của tôi, mặc dù trang của bạn sẽ không hợp lệ nếu bạn tạo nên các thuộc tính, tôi vẫn cứ làm điều đó. Kiểm tra nó trong 4 trình duyệt chính và nếu nó hoạt động, ai quan tâm?

Giải pháp tốt nhất mà tôi có thể nghĩ là một giải pháp không hợp lệ hiện tại, nhưng sẽ ở dạng HTML5, vì vậy rất tốt. Theo đề nghị của ms2ger trong đó câu hỏi khác, tiền tố tùy chỉnh của bạn thuộc tính với data-

http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#embedding-custom-non-visible-data

Answer 2

Có một cái nhìn tại http://www.persvr.org/

kiên trì tính năng một động cơ có nguồn gốc lưu trữ đối tượng mới có tên gọi JavaScriptDB cung cấp cao cấp khả năng mở rộng và hiệu suất

http://ajaxian.com/archives/perseveres-javascriptdb-impressive-json-performance

Answer 3

Vắng mặt một số cách tiêu chuẩn để làm điều này trong HTML4, tôi sẽ bị cám dỗ để tạo ra một yếu tố tiềm ẩn tương ứng với khả năng kéo và cửa hàng của tôi dữ liệu được liên kết trong đó. Đặt tên cho phần tử ẩn tương đối với phần tử có thể kéo để bạn có thể dễ dàng tra cứu thông tin cho nó. Phần mở rộng sau đây thực hiện điều này bằng cách sử dụng một khoảng ẩn. Lưu ý: trong thử nghiệm nó tôi không thể sao chép các vấn đề của bạn với các mục có thể kéo được - dữ liệu() dường như hoạt động tốt với tôi, nhưng tôi đã không thử nghiệm nó với các plugin khác nhau, chỉ UI.Draggable.

Cách sử dụng:

$('#draggableDiv').externalData('key','data'); 
var d = $('#draggableDiv').externalData('key'); 

jQuery.fn.externalData = function(key, data) { 
    var value = this; 
    this.each(function() { 
     var id = this.id+'_external_data'; 
     var elem = jQuery('#'+id+':first'); 
     if (elem.size() == 0) { 
      elem = $('<span style="display: none;" id="' + id + '"></span>"'); 
      elem.appendTo(document.body); 
     } 
     if (data) { 
      elem.data(key,data); 
     } 
     else { 
      value = elem.data(key); 
      return false; 
     } 
    }); 
    return value; 
}; 

Answer 4

HTML 5 thuộc tính dữ liệu mới có thể là những gì bạn đang tìm kiếm.

http://ejohn.org/blog/html-5-data-attributes/

http://dev.w3.org/html5/spec/Overview.html#custom

Answer 5

này là tương đối rõ nhưng khá dang hữu ích: jQuery Metadata Plugin. Nó sẽ cho phép bạn lưu trữ dữ liệu trong tên lớp để truy xuất. Nó chủ yếu được sử dụng cho plugin xác thực nhưng thực sự, có thể thích nghi với bất kỳ kịch bản nào.

Chúc bạn may mắn với bất kỳ điều gì bạn đang làm.