Làm thế nào để sử dụng jQuery để xử lý thẻ script tự động được thêm vào trong song song

Question

Đây là tình hình của tôi: Tôi tự động thêm 2 kịch bản thông qua

$('body').append('<script src="http://localhost:8080/script_1.js"></script>'); 
$('body').append('<script src="http://localhost:8080/script_2.js"></script>'); 

Sau đó, tôi tìm thấy họ sẽ được nạp theo thứ tự thay vì song song từ chrome console.

Tuy nhiên, họ có thể được nạp song song nếu tôi sử dụng một trong hai js mẹ đẻ

document.body.appendChild(script); 

hoặc chức năng jQuery: getScript

$.getScript('http://localhost:8080/script_1.js'); 

tôi đã tìm kiếm rất nhiều và thấy rằng jQuery thực sự sẽ loại bỏ các script , phân tích cú pháp nguồn và sử dụng hàm ajax $ .ajax() để tải tập lệnh thay vì cho phép trình duyệt xử lý. Nhưng hàm $ .getScript() cũng sử dụng $ .ajax() và không bị chặn. Rõ ràng, nó không phải là lỗi của $ .ajax().

Đây là một trường hợp thử nghiệm: Tới http://jquery.com và dán sau kịch bản trong giao diện điều khiển mà sẽ thêm một file js hai lần thông qua jQuery

$('body').append('<script src="/jquery-wp-content/themes/jquery/js/plugins.js"></script>'); 
$('body').append('<script src="/jquery-wp-content/themes/jquery/js/plugins.js"></script>'); 

Kiểm tra thời gian, bạn sẽ thấy chúng được nạp theo thứ tự . Tất nhiên, tôi có thể sử dụng native js hoặc $ .getScript() ở trên để tiết kiệm thời gian của tôi.

Tuy nhiên, tôi muốn biết tại sao? Tại sao các cuộc gọi jQuery ajax này không thêm song song?

Cập nhật

Thú vị hơn, dường như chuỗi chỉ áp dụng cho các kịch bản từ cùng nguồn gốc. Tôi đã cố tải một số tệp js dạng thư viện được lưu trữ trên google và chúng nằm song song. Cố gắng sau cũng trong http://jquery.com

$('body').append('<script src="https://ajax.googleapis.com/ajax/libs/ext-core/3.1.0/ext-core.js"></script>'); 
$('body').append('<script src="https://ajax.googleapis.com/ajax/libs/ext-core/3.1.0/ext-core.js"></script>'); 

Answer 1

Khi phụ thêm kịch bản để DOM, tùy thuộc vào thử nghiệm cross-domain, chức năng ajaxTransport khác nhau được sử dụng.

Một yêu cầu cross-domain sẽ xảy ra khi chúng ta có một giao thức: host: port không phù hợp

Trong trường hợp đầu tiên cùng nguồn gốc:

JQuery sử dụng XMLHttpRequest open chức năng với async=false buộc một yêu cầu đồng bộ (see source).

xhr.open(
     options.type, 
     options.url, 
     options.async, 
     options.username, 
     options.password 
    ); 

Do đó cảnh báo trên bảng điều khiển (ít nhất là trên Canary anyway).

Synchronous XMLHttpRequest về các chủ đề chính được phản

Trong trường hợp thứ hai chéo gốc:

JQuery sử dụng ajax như sau (see source)

script = jQuery("<script>").prop({ 
        async: true, 
        charset: s.scriptCharset, 
        src: s.url 
       })..... 
document.head.appendChild(script[0]); 

mà sẽ tải song song như bạn đã nêu.