jquery

Question

đoạn mã sau hoạt động hiệu quả hơn, nhưng nó làm cho trình duyệt trở nên khó khăn một chút. Không có gì lớn. Tôi tự hỏi liệu có cách nào để làm cho điều này hiệu quả hơn không? Tôi có thể sử dụng bộ nhớ đệm hoặc bằng cách nào đó cư trú một lựa chọn và sau đó chỉ cần sao chép nó vào khác 5. (có 6 thả xuống với một lớp 'mặt nạ' trên trang.)

Bất kỳ trợ giúp sẽ được đánh giá rất nhiều!

$('.mask').each(function() { 
    $(this).append($('<option/>').val("").text("")); 
    for (var i = 1; i < 256; i++) { 
     $(this).append($('<option/>').val(i).text(i)); 
    } 
    }); 
}); 

Answer 1

Bạn có thể tạo các nút một lần sau đó sao chép chúng, như thế này:

var temp = $('<select/>'); 
$('<option/>').val("").text("").appendTo(temp); 
for (var i = 1; i < 256; i++) { 
    $('<option/>').val(i).text(i).appendTo(temp); 
} 
temp.children().clone().appendTo('.mask'); 

Thay vì làm rất nhiều cá nhân gắn thêm vào DOM (mà là rất tốn kém) này lô tất cả các yếu tố lên trong một đoạn tài liệu sau đó nhân bản chúng, chắp thêm theo lô (một lô cho mỗi lựa chọn).

Answer 2

Nó nhanh hơn nhiều (khoảng 3-10 lần, như thử nghiệm here) để xây dựng HTML mình trong một chuỗi duy nhất:

var html = "<option value=''></option>"; 
for (var i = 1; i < 256; i++) { 
    html += "<option value='" + i + "'>" + i + "</option>"; 
} 
$(".mask").append(html); 

Xem kiểm tra hiệu suất so sánh các tùy chọn hiện tại trong luồng này: http://jsperf.com/appending-options-jquery