Hành vi góc trường hợp rất lạ trong Internet Explorer 8 trên trang web của BestBuy

Question

Tôi đã tìm thấy lỗi trên bestbuy.com trong IE8 và tôi dường như không hiểu tại sao nó xảy ra. Nó cũng xảy ra trong IE8 trên các trang web như comcast.com và raymourflanigan.com, nhưng không phải trên google.com hoặc godaddy.com.

Các mã sau ném một lỗi "Invalid procedure call or argument" (đặc biệt là dòng cuối cùng là những gì ném lỗi):

var p = document.createElement("p"); 
var holder = Element.prototype.appendChild; 
holder.apply(document.body, [p]); 

này là rất lạ bởi vì tôi đã thử nó trong các trang web khác trong IE8 và nó hoạt động như một quyến rũ. Tôi đã thử sử dụng .call thay vì .apply và thậm chí lưu trữ tham chiếu đến phương thức gốc appendChild cho một biến khác trên nguyên mẫu Element, nhưng cả hai lần thử này đều có cùng lỗi.

Điều gì gây ra điều này?

Answer 1

chỉnh sửa

"Những loại mã có thể có thể gây ra lỗi này?"

Dường như lỗi có liên quan đến document.body không khả dụng do trang đang ở chế độ nghiêm ngặt. Các chế độ được nhập tại bestbuy như là kết quả của chỉ thị:

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> 

Liên quan đến internet explorer, tùy chọn chrome=1 tạo ra một Google Content Frame (GCF) sẽ buộc trang để hoạt động ở chế độ nghiêm ngặt. comcast.com ở chế độ nghiêm ngặt do tiêu đề tài liệu của nó sử dụng XHTML.

There are various ways to enter document modes in IE

Kết quả ròng của trang bị trong chế độ nghiêm ngặt là bề mặt vẽ trở nên có sẵn tại document.documentElement. Mã này sẽ nối văn bản và một đoạn văn ở dưới cùng của khu vực xem:

var p = document.createElement("p"); 
p.innerHTML = "APPEND"; 
var holder = Element.prototype.appendChild; 
holder.apply(document.documentElement, [p]); 

---

tôi đã fiddle này để kiểm tra hành vi này: http://jsfiddle.net/LAkQk/

đầu tiên tôi quyết định thử nghiệm hành vi này trong nhiều trình duyệt.

Chạy không có lỗi trong chrome, firefox, safari và IE8.

Lưu ý rằng để kiểm tra fiddle này (hoặc bất kỳ thực sự) trên ie8 bạn phải sử dụng /embedded và sau đó nhấp vào "kết quả".

Vì vậy, hãy bắt đầu với xác nhận rằng có điều gì đó trên các trang web gây xung đột.

---

tôi đã có thể lặp lại các lỗi sử dụng IE8 trên bestbuy.com, và để xác nhận rằng nó đã làm việc tại google.com

Tuy nhiên, đây là không một vấn đề với apply hoặc appendChild mỗi Nói.Đó là một vấn đề cụ thể khi vượt qua số document.body. Bạn có thể tự mình kiểm tra mã này tại bestbuy.com:

(function(){ 
var p = document.createElement("p"); 
p.innerHTML = "APPEND"; 
var holder = Element.prototype.appendChild; 
var d = document.getElementById("header"); 
holder.apply(d, [p]); 
})() 

Có thể do mã nào đó được gắn vào phần thân của một trong các plugin của chúng. Amusingly, công trình này từ tức là giao diện điều khiển ở bestbuy.com

$("body").append('<p>Append!</p>'); 

Tôi nhìn qua một số các plugin và không thể tìm ra chính xác dòng mã mà đang gây ra tình trạng quá tải hoặc xung đột, nhưng nó phải có mặt ở đó, nhiều nhiều khả năng là kết quả của việc đánh lừa tác nhân người dùng.

Answer 2

Trình gỡ lỗi nói "'Phần tử' không được xác định" cho mã Travis 'và ngoại lệ JS duy nhất tôi nhận được khi tôi tải trang là' hasAttribute 'là phương thức không được hỗ trợ. Cả hai chỉ xảy ra khi IE8 tải trang ở chế độ tương thích (Chế độ Tài liệu: Tiêu chuẩn IE7), nhưng có lẽ tôi tải một trang khác từ trang của bạn: mã của bạn sử dụng Element để ngoại lệ sẽ giống như mã Travis. Và đây là câu trả lời:

What's IE take on HTMLDocument and HTMLElement

Không có 'tố' trong IE7.