Eine nette Technik, auf die Christian Heilmann in seinem Blog hinweist: Script-Elemente im HTML sind ganz normale Elemente, die nur durch ihre CSS-Display-Eigenschaft unsichtbar sind. Ändert man diese, kann man ein Script-Element als Beispielcode nehmen und gleichzeitig ausführen.
<script style=“display:block;“>
Ergänzt man das Skript-Element um die passende Display-Eigenschaft, wird es sichtbar und trotzdem ausgeführt:
Hier der Code dieses Beispiels:
Das Javascript sollte natürlich auch funktionieren. Einfach mal doppelklicken…
Beschriftungen mit CSS-Pseudoelementen
Zudem lässt sich eine Beschriftung wie „Quellcode:“ dank der CSS-Pseudoelemente :before
und :after
ohne Eingriff in das Markup hinzufügen:
script:before{
content: 'Quellcode:';
}
Auf jeden Fall eine nette Idee. Sollte man dran denken, wenn man mal ein JS-Projekt dokumentiert.