Không có trong DOM sau $ .load() với jQuery?

Question

var id = 'test'; 
var dom = $('#loader').clone().load("Views/chatBox.html"); 
dom.find('span.bn').text(id); 

trong chatBox.html, có:

... 
<span class="bn">AAA</span> 
... 

Tôi muốn thay thế "AAA" với "thử nghiệm", nhưng thất bại (dom.find không thể lấy nó), mà có nghĩa là nó không có sẵn ngay lập tức.

Làm cách nào để thực hiện đúng cách?

Answer 1

Nếu bạn định làm việc với các phần tử trả về, bạn nên thực hiện trên hàm gọi lại, đó là vì việc truy xuất HTML được thực hiện không đồng bộ và hàm gọi lại thực hiện khi yêu cầu kết thúc và các phần tử được tiêm vào DOM:

var id = 'test'; 
$('#loader').load("Views/chatBox.html", function() { 
    $('span.bn', this).text(id); 
}); 

Cũng lưu ý rằng trong ví dụ của bạn, bạn đã clonning yếu tố #loader, và các yếu tố nhân bản không phải là trong DOM nào, bạn sẽ phải chèn nó, nhưng tôi không chắc chắn nếu bạn thực sự muốn sao chép phần tử ...