2010-07-16 34 views
5

Tuyên bố từ chối trách nhiệm: Tôi khá mới với AJAX!Phương pháp thực hành tốt để tải JavaScript qua ajax

Tôi đã xem xét xung quanh và tôi không chắc chắn nên sử dụng phương pháp nào để tải javascript bằng ajax.

Tôi đang sử dụng ajax để yêu cầu các trang mà mỗi trang yêu cầu 6-10 phương pháp ngắn của riêng họ. Tổng cộng có thể có 5-6 trong số các trang này, vì vậy tổng cộng khoảng 35 phương pháp.

Tôi muốn truy cập javascript cần thiết như mỗi trang yêu cầu tải.

Tôi đã nhìn thấy một vài phương pháp, và tôi không chắc chắn mà người ta sẽ phù hợp nhất với nhu cầu của tôi:

  1. Bao gồm một yếu tố kịch bản trống trong đầu, và thao tác các thuộc tính src qua. DOM.

  2. Tạo phần tử tập lệnh mới qua. DOM và nối nó vào document.body (điều này nghe giống như # 1).

  3. jQuery (mà tôi đang sử dụng) có phương thức getjax getScript().
  4. Tôi chưa đọc bất cứ điều gì về nó, nhưng tôi có thể chỉ bao gồm một phần tử kịch bản như một phần của phản hồi ajax không?

Vì tôi mới phát triển ajax và web nói chung, tôi tò mò về những thăng trầm của từng phương pháp cũng như bất kỳ phương pháp nào tôi đã bỏ lỡ.

Một số mối quan tâm là: -Sẽ sử dụng bản sao được lưu trong bộ nhớ cache hoặc mỗi lần yêu cầu ajax được thực hiện. Lưu ý rằng các tập lệnh sẽ tĩnh. -Khả năng tương thích với trình duyệt. Tôi sử dụng Chrome, nhưng ứng dụng này sẽ được sử dụng trên các phiên bản của IE> = 7 cũng như Firefox.

+2

Tại sao không chỉ có một tệp bên ngoài? Nếu đây là những phương pháp rất ngắn, một tập tin sẽ được gzipped và lưu trữ và sẽ không đáng kể cho khách hàng, và đơn giản hóa bảo trì của bạn xuống một thẻ '

0

Đi với getScript. Về cơ bản, nó cũng giống như phương pháp thứ hai, nhưng bạn không phải lo lắng về cách nghe tải trong các trình duyệt khác nhau (chủ yếu là IE).

Phản hồi AJAX chỉ đơn giản là văn bản theo DOM liên quan. Nó không có hiệu lực trừ khi bạn chèn nó vào DOM bằng cách nào đó.

+0

Tôi khuyên bạn nên * chống lại * điều này, '$ .getScript()' cố ý không lưu vào bộ nhớ cache, bạn có thể xem tại đây: http://github.com/jquery/jquery/blob/master/src/ajax.js#L265 –

+0

Tôi đồng ý với Nick, đi theo cách $ .ajax bằng một kiểu dữ liệu tập lệnh. –

+0

@Nick @Julian - điểm tốt, tôi không biết jQuery lén lút trong dấu thời gian trong URL :). Tôi chỉ nói 'ajaxSetup' để có bộ nhớ đệm vĩnh viễn trong suốt, hoặc thậm chí tốt hơn [ghi đè lên] (http://jamiethompson.co.uk/web/2008/07/21/jquerygetscript-does-not-cache/) bản gốc' getScript 'phương pháp để tùy chọn cho phép bộ nhớ đệm, và vẫn còn tương thích ngược. Nếu jQuery bỏ lỡ nó, thì chúng ta sẽ không. Đó không phải là những gì JavaScript là tất cả về? : P – Anurag

1

Như tất cả các câu trả lời khác ở đây chỉ nói "sử dụng jquery" mà không cần thêm bất kỳ thông tin/giải thích/xưng công bình, nó có thể là giá trị thực sự nhìn vào các tùy chọn khác mà bạn đã đề cập.

  • Lựa chọn # 1

    có thể là một chút phức tạp vì nó đòi hỏi bạn phải đợi cho đến khi một kịch bản có tải về và chạy trước khi lấy người tiếp theo (như bạn đã chỉ có một yếu tố kịch bản).

  • Lựa chọn # 2

    là tốt hơn là bạn có thể thêm một yếu tố kịch bản thứ hai để DOM trước khi là người đầu tiên đã hoàn tất tải, mà không ảnh hưởng đến download/thực hiện.

  • Lựa chọn # 3

    khuyến cáo của tất cả mọi người trước mặt tôi là tốt nếu bạn đang ở trong một môi trường jQuery và đã tải (khá nặng) jQuery thư viện cho các mục đích khác - tải nó cho mình này rõ ràng là không cần thiết . Cũng cần lưu ý rằng $.getScript()$.ajax() đều sử dụng eval() để thực thi tập lệnh. eval() không phải là "ác" trong ngữ cảnh này vì nó là một nguồn đáng tin cậy, nhưng nó có thể trong kinh nghiệm của tôi đôi khi hơi khó khăn hơn để gỡ lỗi mã eval() - ed.

  • Tùy chọn # 4

    không thể thực hiện được.

  • Lựa chọn # 5

    khuyến cáo của Nick Craver trong các bình luận OP đầu tiên là những gì tôi muốn đi với tbh - nếu kịch bản là tĩnh như bạn nói, bộ nhớ đệm sẽ hiệu quả hơn nhiều yêu cầu HTTP. Bạn cũng có thể xem xét sử dụng cache.manifest cho bộ nhớ đệm tích cực nếu bạn đặc biệt quan tâm đến băng thông: http://www.html5rocks.com/tutorials/appcache/beginner/

Các vấn đề liên quan