JS im IE8

[Max]

Hallo Leute,
ich bin dabei, Quicksand in meine Seite zu integrieren, das heißt die Quicksand-min.js ans Ende des body und die Selection (var elements = Quicksand.select('div p:nth-of-type(even)');) und den Style (~~~javascript for(var i = 0; i < elements.length; i++) {
    elements[i].style.background = '#ddd';
}

Funktioniert einwandfrei im Firefox, aber leider nicht im IE8 ... Die Fehler liegen laut dem IE8 in der Quicksand-min.js in Zeile 88 bei Zeichen 139 (`for(var b=[],d=0;d<c.length;d++)A.apply(b,c[d].getElementsByTagName(e));`{:.language-javascript}) und in Zeile 28 bei Zeichen 159 (`var h=[];A.apply(h,f[0].getElementsByTagName(a));`{:.language-javascript}) (je "JScript-Objekt erwartet", "Code 0").  
Wie kriege ich die Engine im IE8 zum Laufen? Integriere ich vielleicht auch falsch? Wie müssen die Fehler korrigiert werden? Es sollte nicht am IE8 liegen; [der IE7 scheint zu klappen](http://quicksand.joijs.com/home/#performance).  
Ich danke euch schon mal vielmals!  
Max

[Gunnar Bittersmann]

@@Max:

nuqneH

ich bin dabei, Quicksand in meine Seite zu integrieren,

Wozu??

“Instead of spending your time trying to make websites look the same in wildly varying browsers, you can spend your time making sure that the core functionality of what you’re building works everywhere, while providing the best possible experience for more capable browsers.” [adactio]

Funktioniert einwandfrei im Firefox, aber leider nicht im IE8 ...

So’n Aufwand wegen eines visuellen Gimmicks im IE 8? Nicht wirklich, ne?

Schmeiß das JavaScript raus, ``div p:nth-of-type(even) { background: #ddd' }{:.language-css} ins Stylesheet und gut is’.

Qapla'

[Jacob]

Hallo Max

Die Fehler liegen laut dem IE8 in der Quicksand-min.js in Zeile 88 bei Zeichen 139 (for(var b=[],d=0;d<c.length;d++)A.apply(b,c[d].getElementsByTagName(e));) und in Zeile 28 bei Zeichen 159 (var h=[];A.apply(h,f[0].getElementsByTagName(a));) (je "JScript-Objekt erwartet", "Code 0").
Wie kriege ich die Engine im IE8 zum Laufen?

Ich vermute gar nicht, denn diese Library schaut nicht gut aus. Weder gibt es genaue Browsersupportangaben noch eine Testsuite. Der Code wird nicht öffentlich gepflegt und seit 3 Jahren gibts kein Release mehr.

Mir deucht du machst alles richtig bei der Benutzung und der Fehler liegt in der Library. Die Demoseite funktioniert in meinem IE 8 schon nicht, es gibt mehrere JS-Fehler. Um den Fehler zu finden müsste man tief in die Selector Engine einsteigen. Das kann Stunden dauern. Du könntest mit der unkomprimierten Version probieren dem Fehler mit dem IE8 Debugger auf den Grund zu gehen.

Gibt es einen speziellen Grund warum du Quicksand verwendest? Falls du eine aktuelle Selector Engine suchst würde ich Sizzle oder gleich jQuery empfehlen.

Letztlich kannst du auch prüfen ob du IE 8 bei deiner Seite noch unterstützen musst. Er ist nicht mehr sooo stark verbreitet. IE 9 kennt viele CSS Selektoren und die JS Funktionen getElementsByClassName, querySelector, querySelectorAll. Hat also schon eine brauchbare Selector Engine eingebaut. Das als allgemeiner Hinweis. Hängt natürlich von deinem Anwendungsfall ab, den ich nicht kenne.

viel Erfolg
Jacob

[Max]

Der Code wird nicht öffentlich gepflegt und seit 3 Jahren gibts kein Release mehr.

Also das Release von GitHub ist noch von Anfang 2013, sicherlich auch parallel zu den CSS4 Selektoren.

Um den Fehler zu finden müsste man tief in die Selector Engine einsteigen. Das kann Stunden dauern. Du könntest mit der unkomprimierten Version probieren dem Fehler mit dem IE8 Debugger auf den Grund zu gehen.

Ich bin ja noch guter Dinge, dass sich so ein JS Crack hier noch findet! ;-)

Gibt es einen speziellen Grund warum du Quicksand verwendest?

CSS4 Selektoren und Speed Tests! Und auch nur als Polyfill..

Was sagst du hierzu?
Funktioniert einigermaßen im IE8, auch :last-child und Ähnliches, wenn auch nicht ganz sauber... :not() jedenfalls nicht! (Offenbar wieder Fehler im Script!!)

Ich brauch auf jeden Fall :not(), aber möglichst auch :local-link und :column(), und zwar im IE8.

PS: Wie kann ein Skript auch im head ordentlich ausgeführt werden (statt am Ende des body)? (Abgesehen von innerHTML!)

PPS: Wie kann in JS mit reinem CSS ohne Klassen gestylt werden? Also nicht style.background = '#ddd', sondern etwa auch { border-collapse: collapse; }?

[Gunnar Bittersmann]

@@Max:

nuqneH

Ich brauch auf jeden Fall :not(), aber möglichst auch :local-link und :column(), und zwar im IE8.

Ach so, ``div p:nth-of-type(even) { background: #ddd' }{:.language-css} war also nur beispielhaft?

Und warum meinst du, das „auf jeden Fall [zu brauchen], und zwar im IE8“? Wozu dieser enorme Aufwand?

Du müsstest alles doppelt pflegen: einmal die CSS-Variante und zusätzlich die JavaScript-Variante für Uralt-IEs.

Du dachtest doch nicht etwa daran, das mit JavaScript für alle Browser zu machen, oder? Das würde bedeuten, allen eine schlechte UX vorzusetzen (Stylen per JavaScript dürfte um einiges langsamer sein als mit reinem CSS) wegen der paar Nutzer, die noch mit einem Uralt-IE daherkommen?

Zumal sie das gar nicht sollten. Microsoft hat den Support eingestellt und rät selbst von der Verwendung ab. Sicherheitslöcher in Uralt-IEs werden nicht gefixt. Wer noch damit unterwegs ist, ist eine Gefahr für sich und andere.

Man sollte nicht die Lebensdauer von Uralt-IE künstlich verlängern, indem man seine Seiten auch für diese noch anpasst.

Vielmehr auf progressive enhancement setzen. Seiten sollten in allen Browsern benutzbar sein (auch IE 4). Aber nicht gleich aussehen. Do Websites Need to Look Exactly the Same in Every Browser?

Falls du dich immer noch nicht davon abbringen lassen solltest, Seiten für Uralt-IEs auf Hochglanz polieren zu wollen: Man kann den IE 8 auch in den 7er Modus schicken und dann CSS-Expressions verwenden.

PS: Wie kann ein Skript auch im head ordentlich ausgeführt werden (statt am Ende des body)? (Abgesehen von innerHTML!)

Warum sollte es das? Ende des body ist der beste Platz. Bei Scripten im head müsste man auf das DOM-ready-Event lauschen.

PPS: Wie kann in JS mit reinem CSS ohne Klassen gestylt werden? Also nicht style.background = '#ddd', sondern etwa auch { border-collapse: collapse; }?

Genauso. Aus Bindestrich wird CamelCase: style.borderCollapse = 'collapse'

Qapla'

[Mitleser]

Und warum meinst du, das „auf jeden Fall [zu brauchen], und zwar im IE8“? Wozu dieser enorme Aufwand?

Zumal sie das gar nicht sollten. Microsoft hat den Support eingestellt und rät selbst von der Verwendung ab. Sicherheitslöcher in Uralt-IEs werden nicht gefixt. Wer noch damit unterwegs ist, ist eine Gefahr für sich und andere.

Das mit dem Abraten stimmt. Dass der Support aber eingestellt wäre und es keine Fixes mehr gäbe, ist falsch. Selbst für den IE7 gibt es diese noch.

[Gunnar Bittersmann]

@@Gunnar Bittersmann:

nuqneH

Man kann den IE 8 auch in den 7er Modus schicken und dann CSS-Expressions verwenden.

Oder

* html { display: none }  
*+html { display: none }

Problem solved. ;-)

Qapla'

[Max]

Du dachtest doch nicht etwa daran, das mit JavaScript für alle Browser zu machen, oder?

Nee!! Nur als Polyfill!

man seine Seiten auch für diese noch anpasst.

Ich bin da sehr gewissenhaft und gehe ja nicht gleich bis zum IE4 runter.

Seiten sollten in allen Browsern benutzbar sein (auch IE 4). Aber nicht gleich aussehen.

Demnach bräuchte es ja gar keinen Style, sondern nur Markup. Gut, das kann sogar ich akzeptieren.. Nur wenn Style, dann kein halber ("so ungefähr"), sondern der ganze!

Man kann den IE 8 auch in den 7er Modus schicken und dann CSS-Expressions verwenden.

Gibts da auch was für (CSS4) Selektoren?