Những trình duyệt nào hỗ trợ <script async = thời gian async ốp lưng />?


196

Vào ngày 1 tháng 12 năm 2009, Google đã công bố hỗ trợ cho theo dõi Google Analytics không đồng bộ .

Theo dõi không đồng bộ đạt được bằng cách sử dụng lệnh async cho <script>thẻ.

Những trình duyệt nào hỗ trợ lệnh async ( <script async="async" />) và kể từ phiên bản nào?


1
Nó nằm ngay trên trang mà bạn đã liên kết đến: "Firefox 3.6 là trình duyệt đầu tiên chính thức cung cấp hỗ trợ cho tính năng mới này" FWIW là một tính năng HTML5, nhanh chóng nhận được sự hỗ trợ tốt hơn và tốt hơn.
Lưỡi liềm tươi

51
Thông số HTML5 nói rằng async = "true" là bất hợp pháp. Là một thuộc tính HTML boolean, sự hiện diện của thuộc tính cho biết "true", trong khi sự vắng mặt của thuộc tính bằng "false". Nếu thuộc tính có mặt, các giá trị hợp lệ duy nhất cho thuộc tính là "" và "async".
Joel Mueller

Đây là một thử nghiệm trực tiếp của thuộc tính này html5demo.braincracking.org/demo/async.php .

3
Đây phải là dấu trang để kiểm tra thường xuyên cho bất kỳ ai quan tâm đến vấn đề này: en.wikipedia.org/wiki/Comparison_of_layout_engines_%28HTML5%29
pumpkinthehead

Câu trả lời:


162

Hỗ trợ async theo chỉ định của google đạt được bằng hai phần:

  • sử dụng tập lệnh trên trang của bạn (tập lệnh được cung cấp bởi google) để viết thẻ <script> vào DOM.

  • tập lệnh đó có thuộc tính async = "true" để báo hiệu cho các trình duyệt tương thích rằng nó có thể tiếp tục hiển thị trang.

Phần đầu tiên hoạt động trên các trình duyệt mà không hỗ trợ <script async..thẻ, cho phép chúng tải async bằng "hack" (mặc dù khá chắc chắn) và cũng cho phép hiển thị trang mà không cần chờ ga.js.

Phần thứ hai chỉ ảnh hưởng đến các trình duyệt tương thích hiểu thuộc tính html async

  • FF 3.6 trở lên
  • FF cho Android Tất cả các phiên bản
  • IE 10+ (bắt đầu với bản xem trước 2)
  • Chrome 8+
  • Chrome dành cho Android Tất cả các phiên bản
  • Safari 5.0+
  • iOS Safari 5.0+ trở lên
  • Trình duyệt Android 3.0+ (tổ ong trở lên)
  • Opera 15.0+
  • Opera Mobile 16.0+
  • Opera Mini Không có (kể từ 8.0)

Cách "html5 thích hợp" để chỉ định async là với a <script async src="...", không phải <script async="true". Tuy nhiên, các trình duyệt ban đầu không hỗ trợ cú pháp này và chúng cũng không hỗ trợ cài đặt thuộc tính tập lệnh trên các phần tử được tham chiếu. Nếu bạn muốn điều này, danh sách thay đổi:

  • FF 4+
  • IE 10+ (xem trước 2 trở lên)
  • Chrome 12+
  • Chrome dành cho Android 32+
  • Safari 5.1+
  • Không có phiên bản Android

34
Tôi không chắc bạn thậm chí cần async = "true", bạn chỉ có thể viết 'async'
vsync

4
vì vậy nếu tôi tạo thẻ script như google thì không - điều gì sẽ đúng: var s = document.createEuity ('script'); s.async = 'true'; s.async = true; (google thực hiện theo cách đó) hoặc s.async = 'async'; ?
Toby

8
@Tobias: bạn đang xen kẽ các thuộc tính boolean HTML và các thuộc tính thành phần DOM tương ứng: thuộc tính HTML (hiện diện trong đánh dấu và khi cài đặt rõ ràng các thuộc tính bằng cách sử dụng setAttribute, không được khuyến nghị) chỉ nên xuất hiện hoặc được đặt thành một chuỗi trống hoặc chính nó ( defer="defer", đặc biệt quan trọng khi viết tài liệu tuân thủ XHTML); khi cài đặt thuộc tính của phần tử một cách nhanh chóng bằng JavaScript, người ta nên sử dụng s.async = true.
Marcel Korpel

39
@vsync: Nó thậm chí không nên true; hoặc async, async=""hoặc async="async".
Marcel Korpel

4
Xin lưu ý rằng bài đăng được liên kết trong bộ câu hỏi async="true". Đó không phải là cách chính xác để làm điều đó giờ đây , nhưng nó là cách duy nhất hỗ trợ rộng rãi để làm điều đó rồi . Ví dụ: IE10p2 được hỗ trợ async="true"nhưng không hỗ trợasync="async"
Philip Rieck

60

Có hai phần cho câu hỏi này, thực sự.

  1. H: Trình duyệt nào hỗ trợ thuộc tính "async" trên thẻ script khi đánh dấu?

    Trả lời: IE10p2 +, Chrome 11+, Safari 5+, Firefox 3.6+

  2. Q: Những trình duyệt hỗ trợ spec mới mà định nghĩa hành vi cho "async" bất động sản trong JavaScript, trên một yếu tố kịch bản tự động tạo ra?

    A: IE10p2 +, Chrome 12+, Safari 5.1+, Firefox 4+

Đối với Opera, họ rất gần với việc phát hành một phiên bản sẽ hỗ trợ cả hai loại không đồng bộ. Tôi đã làm việc với họ chặt chẽ về vấn đề này và nó sẽ sớm ra mắt (tôi hy vọng!).

Thông tin thêm về order-async (còn gọi là "async = false") có thể được tìm thấy ở đây: http://wiki.whatwg.org/wiki/Docate_Script_Execut_Order

Ngoài ra, để kiểm tra xem trình duyệt có hỗ trợ hành vi thuộc tính async động mới hay không: http://test.getify.com/test-async/



10

Từ trang tham chiếu của bạn:

http://googlecode.blogspot.com/2009/12/google-analytics-launches-asyn syncous.html

Firefox 3.6 là trình duyệt đầu tiên chính thức cung cấp hỗ trợ cho tính năng mới này. Nếu bạn tò mò, đây là chi tiết khác về thông số kỹ thuật không đồng bộ HTML5 chính thức .


"Tính năng mới này" đề cập đến thuộc tính async HTML5. Đoạn mã không đồng bộ Google Analytics được tất cả các trình duyệt hỗ trợ.
Brian

1

Hiện asynctại được hỗ trợ bởi tất cả các phiên bản mới nhất của các trình duyệt chính. Nó đã được hỗ trợ trong một số năm nay trên hầu hết các trình duyệt.

Bạn có thể theo dõi những trình duyệt nào hỗ trợ async (và defer) trong trang web MDN tại đây:
https://developer.mozilla.org/en-US/docs/HTML/Euity/script


Mặc dù liên kết này có thể trả lời câu hỏi, tốt hơn là bao gồm các phần thiết yếu của câu trả lời ở đây và cung cấp liên kết để tham khảo. Câu trả lời chỉ liên kết có thể trở nên không hợp lệ nếu trang được liên kết thay đổi. - Từ đánh giá
Michael Gaskill

@MichaelGaskill Thế này đã đủ chưa? Bạn có muốn tôi liên kết đến câu trả lời của Philip không?
brunoais

0

Chỉ cần nhìn vào DOM (document.scripts [1] .attribut) của trang này có sử dụng phân tích google. Tôi có thể nói với bạn rằng google đang sử dụng async = "".

[type="text/javascript", async="", src="http://www.google-analytics.com/ga.js"]
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.