Bardzo dziwne zachowanie w przypadku skrzynek w przeglądarce Internet Explorer 8 na stronie internetowej BestBuy

Question

Znalazłem błąd na bestbuy.com w IE8 i nie mogę zrozumieć, dlaczego tak się dzieje. Występuje również w IE8 na stronach takich jak comcast.com i raymourflanigan.com, ale nie na google.com lub godaddy.com.

Poniższy kod rzuca "Invalid procedure call or argument" błąd (szczególnie ostatnia linia jest co generuje błąd):

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

To jest bardzo dziwne, bo ja próbowałem w innych stronach w IE8 i działa jak urok. Próbowałem użyć .call zamiast .apply, a nawet zapisać odniesienie do oryginalnej metody appendChild do innej zmiennej w prototypie Element, ale obie te próby spowodowały ten sam błąd.

Co to powoduje?

Answer 1

edit

"Jaki kod mógłby powodować ten błąd?"

Wygląda na to, że błąd związany z document.body jest niedostępny w wyniku działania trybu ścisłego. Tryb jest wpisany w BestBuy w wyniku dyrektywy:

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

W odniesieniu do programu Internet Explorer, opcja chrome=1 tworzy Google Content Frame (GCF) zmusi stronę do pracy w trybie ścisłym. comcast.com jest w trybie ścisłym w wyniku nagłówka doctype przy użyciu XHTML.

There are various ways to enter document modes in IE

Wynik netto strona jest w trybie ścisłym jest to, że powierzchnia rendering będzie dostępny w document.documentElement. Ten kod dołączy tekstu i akapitu w dolnej części obszaru wyświetlania:

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

---

Zrobiłem ten skrzypce w celu przetestowania tego zachowania: http://jsfiddle.net/LAkQk/

raz pierwszy zdecydowaliśmy się przetestować to zachowanie w wiele przeglądarek.

Działa bez błędów w chrome, firefox, safari i IE8.

Pamiętaj, że aby przetestować to skrzypce (lub naprawdę) na ie8, musisz użyć /embedded, a następnie kliknąć "wynik".

Po prostu zacznijmy od stwierdzenia, że ​​coś jest na tych stronach, które powoduje konflikt.

---

udało mi się powtórzyć błędu przy użyciu IE8 na bestbuy.com, oraz w celu potwierdzenia, że ​​nie działa na google.com

Jest to jednak nie problem z apply lub appendChild os mówić.Jest to szczególnie problem z przekazaniem document.body. Można to sprawdzić samemu z tym kodem na 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]); 
})() 

Być może to dlatego, że czegoś przymocowana do korpusu w wyniku jednego ze swoich wtyczek. Zabawnie, to działa z konsoli czyli w BestBuy.com

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

Przejrzałem wiele wtyczek i nie może znaleźć dokładną linię kodu, który powoduje przeciążenie lub konflikt, ale to musi być tam więcej prawdopodobnie w wyniku wąchania agenta użytkownika.

Answer 2

Debugger mówi "Element" jest niezdefiniowany "dla kodu Travisa" i jedyny wyjątek JS, jaki otrzymuję po załadowaniu strony, to "hasAttribute" to metoda nieobsługiwana. Zarówno dzieje się tak, gdy IE8 ładuje stronę w trybie zgodności (Tryb Dokumentu: Standardy IE7), ale prawdopodobnie ładuję inną stronę niż twoja: twój kod używa Elementu, więc wyjątek byłby taki sam jak dla kodu Travisa. A oto odpowiedź:

What's IE take on HTMLDocument and HTMLElement

Nie ma 'element' w IE7.