Test auf Verfügbarkeit von Javascript in HTML

Auf meinem Weg meinen Blog mit einem Elasticsearchindex zu versehen möchte ich ElasticsearchUI verwenden. Dabei handelt es sich um eine Javascript Anwendung die logischerweise von Lesern zu einer unschönen Darstellung führt die im Browser Javascript ausgeschaltet haben.

Über die Anweisung “noscript” kann man sehr einfach HTML einbinden wenn dies geschehen ist.

Nur leider gibt es keine einfache Möglichkeit für eine Abfrage “ist Javascript enabled?” die man verwenden könnte damit man Links anzeigt wenn Javascript verfügbar ist. Dieser Beitrag zeigt einen schönen Weg auf

In den Header kommt folgendes Javascript

 <   script type="text/javascript">
    //<![CDATA[
        document.getElementsByTagName('html')[0].className='jsOn';
    //]]>
   </script>

Und in die CSS Klassen nimmt man folgendes Element auf

  <style>.YesScript { display:none; }.jsOn .YesScript { display:block; }</style>

Und dann kann man die Elemente die man bei verfügbarem Javascript anzeigen möchte dem Style YesScript versehen.

Ich werden das verwenden um

  • bei ausgeschaltetem Javascript eine Suche via DuckDuckGo anzubieten
  • bei eingeschaltetem Javascript die Suche über Elasticsearch anzuzeigen.