Internet Explorer und der „div“-Tag

  • 21.05.2010
  • Oliver
  • 1 Kommentar

Vor kurzem stand ich vor folgendem Szenario bei der Entwicklung mit ASP.NET MVC und JQuery:

Ich hatte eine Website erstellt, die dynamisch Inhalte vom Server nachgeladen hat. Gut, werden sich jetzt einige denken, das ist doch inzwischen Standard und sollte keine Probleme bereiten. Für gewöhnlich ist dies auch so, jedoch gab es hier eine Ausnahme: den Internet Explorer.

Man denke sich folgenden vereinfachten Quellcodeabschnitt:

<input type="text" onchange="$.get("/myController/Search",
   {query :  $(this).val()},
   function (resultValue)
   { $('#result_placeholder').html(resultValue); }  />
<div id="result_placeholder" />
<input type="submit" value="Suche starten" />

Mit eigenen Worten beschrieben: Gibt man etwas in das Textfeld ein, wird eine Anfrage mit dem Inhalt der Textbox an den Server gesendet und Resultate in das div mit der Id result_placeholder hineingeschrieben.

Das klappte auch wunderbar. Jedoch war daraufhin mein „Suche starten“-Knopf verschwunden und ich konnte mir nicht erklären warum. Durch eine Analyse des zur Laufzeit vorliegenden Quelltextes konnte ich dann auch sehen, dass mein Submit-Button tatsächlich nicht mehr vorhanden war. Es stellte sich mir also die Frage, wieso er im Internet Explorer verschwand und in allen anderen Browsern weiterhin vorhanden war.

Die Lösung des Ganzen ist relativ einfach. Anstatt <div id=“result_placeholder“ /> schreibt man <div id=“result_placeholder“></div> in den Quelltext, dann wird der Inhalt richtig gesetzt und auch der „Suche starten“-Button ist weiterhin vorhanden. 🙂

Edit:

<!DOCTYPE html PUBLIC „-//W3C//DTD XHTML 1.0 Strict//EN“ „http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd„>
<html xmlns=“http://www.w3.org/1999/xhtml„>

Diesen DOCTYPE verwende ich bei dem oben genannten Problem. Laut W3C ist damit das Dokument als XHTML ausgezeichnet und mein „<div />“ standardmäßig erlaubt. In dem Zusammenhang ist auch meine Beobachtung zu betrachten.

Kommentare

Sebastian sagt: vor 10 Jahren


Interessante Beobachtung. Entsprechendes gilt auch für das "<script>"-Tag.




Nunja, in HTML bedeutet "<div />" das gleiche wie "<div>", so dass alles nachfolgende bis zum Abschluss des übergeordneten Tags als Inhalt des div-Blocks interpretiert wird.




Man muss dem Browser also sagen, dass man XHTML mit ihm sprechen will, wenn man "<div />" als geschlossen interpretiert wissen will, d.h. man müsste

Content-Type: application/xhtml+xml

senden. Dass manche Browser wie z.B. Firefox auch bei
Content-Type: text/html

aus dem Inhalt heraus erraten, dass der Designer wohl eigentlich XHTML meint, ist nur durch eine gutgemeinte Inkonsequenz in der Definition von XHTML 1.0 zu rechtfertigen, das sich als Übergangslösung zwischen HTML 4 und XHTML 1.1 verstanden wissen will. Vgl. dazu die XHTML FAQ:

"[...] sending XHTML documents to browsers as text/html means that those browsers see the documents as HTML documents, not XHTML documents."




IE ist also in diesem Fall nicht buggy, sondern konsequent. Er spricht HTML.




Dass IE mit "application/xhtml+xml" nichts anfangen kann und es relativ umständlich ist, ihm tatsächlich XHTML aufzuzwingen, steht auf einem anderen Blatt. Oh ja, ein weites Feld ...



  Auf Kommentar antworten

Einen Kommentar schreiben

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>




* Pflichtfelder