Self-Assessments zu ESA-auf-1-2014

Nächste Vorherige Lösung Punkte

Eine Zusammenkunft von Personen, die sich mit einem speziellen Themenbereich beschäftigen gibt es schon "seit der Steinzeit". Tagungen, Kongresse, Konferenzen, Symposien, Lehrveranstaltungen, Tutorien, Workshops, Exkursionen, Firmen-Besichtigungen, Podiumsdiskussionen, Meetings, Incentives, Conventions, Events, usw. [mehr]

Es gibt

Großveranstaltungen (über 1000 Teilnehmer)
Kongresse (mit ca. 200-1000 Teilnehmern)
Tagungen (ca. 100-200 Teilnehmern) ²)
Symposien (ca. 31-100 Teilnehmern)
Seminare (bis ca. 30 Teilnehmern).
Kurse (bis ca. 30 Teilnehmern)

Die ECMAScript-Bibliothek JQuery ( John Resig ) wurde 2006 auf dem BarCamp (NYC) in New York veröffentlicht.

Ein BarCamp ist eine kostenlosen "Mitmach-Konferenz". [mehr]

Bei einem BarCamp werden Ablauf und Inhalte von den Teilnehmern selbst entwickelt. Beinahe jeder Teilnehmer bringt ( spontan ) seine Session ( "Diskussionsrunde" ) ein. [mehr]

Ein EduCamp ergänzt BarCamp und Open Space mit etablierte Konferenzmethoden ( Podiumsdiskussion und, usw. ). [mehr]

Es gibt heute zahlreiche "Camp's", wie z.B.:

 
ArtCamp
BarCamp               - erste offene Unkonferenzformat nach Tim O'Reilly's FooCamp; 
BibCamp               - für Bibliothekare
BleibGesundCamp       - Personal Health
BuchCamp              - Bücher 2.0
CarCamp               - Alles rund um Autos
CareCamp              - rund um Pflege und Betreuung
CloudCamp             - Alles rund um Cloud Computing
CommunicationCamp     - für Marketing und Fundraising
CorporateLearningCamp
DialogCamp            - für Internet und Datenschutz
DevCamp               - für Entwickler
eCommerceCamp
EduCamp               - für Lehrer, Erzieher, Medienpädagogen
fbcamp                - Alles rund um Facebook
FotoCamp
GrillCamp             - für Grill- Fanatiker
gpluscamp             - Alles rund um Google+
HotelCamp
HR BarCamp
KnowledgeCamp
LawCamp
MakerJam
MobileCamp
MobileMonday          - für mobile Enthusiasten
mUXCamp               - Mobile User Experience
RootCamp              - Open Source Themen für Admins
ScreencastCamp        - rund um Audio und Video
SEACamp               - für Online Marketing-Spezialisten
SocialCamp
SoulCamp              - Meditationen,Yoga und andere Praktiken
SpaceUp
Startup Weekend
TourismusCamp
VideoCamp            - Storytelling im Webvideo

Der folgende Quellcode bildet lediglich ein grobes Gerüst. Richtige Aussagen bitte anhaken.

<!DOCTYPE html>
<html lang="de">
<head>
<title> Code-Muster</title>
<meta charset="UTF-8" />
</head>
<body>
<h1> Test </h1>
</body>
</html>

An den Zeichen < und > wird ersichtlich, daß dieses Quellcode-Gerüst zu einer Markup-Language gehört.

Zu dem Quellcode-Gerüst gehört dieses Logo:

Zur Zeit (Febr 2014) ist HTML 5 ein W3C-Arbeitsentwurf (Working Draft)

Zur Zeit (Febr 2014) ist HTML 5 ein W3C-letzter Aufruf (Last Call Working Draft)

Zur Zeit (Febr 2014) ist HTML 5 ein W3C-Empfehlungskandidat (Candidate Recommendation) [mehr]

Zur Zeit (Mai 2012) ist HTML 5 ein W3C-Empfehlungsvorschlag (Proposed Recommendation)

Eine HTML-Seite verwende im body die folgende Struktur:

<div id="page">
  <div id="head"><h1> DOM und unescape() </h1></div>
  <div id="nav">...</div>
  <div id="content">...</div>
</div>

Die id-, title-, style-, class-, lang-Attribute eines Tags gehören zu den Universal-Attributen von HTML.

Der Wert eines id-Attributes muß seitenweise eindeutig sein.

Auf ein Tag-Objekt, das ein id="content" - Property hat, kann per DOM mit var obj = document.getElementById("content"); zugegriffen werden.

Eine HTML-Seite habe 3 div-Objekte. Dann kann auf das letzte div-Objekt per DOM mit var last_div = document.getElementsByTagName("div")[3]; zugegriffen werden.

Weil in einem div-Tag keine weiteres div-Tag geschachtelt werden dürfen, liefert eine div-Schachtelung einen Validierungsfehler.

Es geht um das folgende Formular, das sich in einem HTML-Body befinde. Richtige Aussagen bitte anhaken.

<form action="#">
  <textarea id="TA0" cols="90" rows="30"> <!-- 1 -->
  </textarea>
</form>

Der Formular-Quelltext validiert nach validator.w3, auch wenn  durch <p> text </p> ersetzt wird.

Der Formular-Quelltext validiert nach validator.w3, auch wenn  durch <textarea cols="90" rows="10"></textarea> ersetzt wird.

Ist das obige Formular das erste Formular im HTML-Body, so liefert

<script>
var o1 = document.getElementById("TA0"),
    o2 = document.getElementsByTagName("textarea")[0],
    o3 = document.forms[0].elements[0],
    s  = [(o1===o2),
          (o2===o3),
          (o3===o1)].join(", "); alert(s);
</script>

die alert(s)-Anzeige alert(s) true, true, true

Eine *.css-Datei ( z.B. frames/tools.css ) enthalte die Styles für die Toolchen-Seite. Die *.css-Datei enthalte bereits

a        { ... }
a:link   { ... }
a:hover  { ... }
a:active { ... }
a:focus  { ... }

Nun werden jeder dieser a-Tag-Style-Deklarationen

... border-left:1px solid #ccc; text-decoration: none;

hinzugefügt. Richtige Aussagen bitte ankreuzen.

Infolge der Hinzufügungen werden alle a-Tag-Texte ( innerHTML ) dann stets unterstrichen.

Alle a-Tag-Texte ( innerHTML ) erhalten am links Textrand eine dünne, vertikale, hellgraue Linie.

Die vorherigen Style-Festlegungen werden nur dann durch das Hinzufügen überschrieben, wenn die alten a-Styles kein border-left und text-decoration hatten oder falls doch, diese border-left- und text-decoration-Werte ohne !important waren.

Es geht um die Ausführungsreihenfolge und Ausführungskontexte der Ereignisse bei dem folgenden a-Tag.

<a id="A_ID"
   href="javascript:alert(this.document.getElementById('A_ID').nodeName);"
   onclick="alert(this.id);return true;">
   teste 
</a>

Richtige Aussagen bitte ankreuzen.

Weil bei diesem a-Tag href vor onclick steht, wird bei einen Klick auf das a-Tag erst href und dann onclick ausgeführt.

Bei einen Klick auf das a-Tag wird erst onclick ausgeführt und infolge von return true danach auch noch href.

Bei einen Klick auf das a-Tag zeigt die onclick-alert-Box den String "A_ID" an.

Bei einen Klick auf das a-Tag zeigt die href-alert-Box den String "A" oder "a" ( browser-abhängig )an.

Ein modernes Eventhandling führt browserintern onclick="function anonymous(event) { alert(this.id); return true; }

Es geht um das inline-Einblenden von HTML-Content, insbesondere soll mit Hilfe der Funktion toggle() ein id="MY_ID" span-Tag-Text "EINGEBLENDET", d.h. sichtbar und unsichtbar geschalten werden. Die Funktion toggle() sieht etwa so aus:

<script>
function toggle(that, id_dst, visu, s1, s2) { var s = that.innerHTML, 
  dst = document.getElementById(id_dst); if(!that || !dst){ return; }
  s1 = s1 || '[-]'; s2 = s2 || '[+]'; visu = visu || 'block';
  if (s.indexOf(s2) === -1) {
    that.innerHTML = s.replace(s1,s2); dst.style.display = 'none';
  } else {that.innerHTML = s.replace(s2,s1); dst.style.display = visu;
  }
}
</script>

<p> Beginn
  <a href="#" onclick="toggle(this,'MY_ID','inline','[-]','[+]')">[+]</a>
  <span id="MY_ID" style="display:none;"> EINGEBLENDET </span>
  <a href="#" onclick="toggle(this,'MY_ID','inline','[weniger]','[mehr]')">[mehr]</a>
  Ende
</p>

Die beiden a-Tags verwenden onclick="...". Dies ist erforderlich, weil die Alternative href="javascript:toggle(this,'MY_ID');" für this nicht das a-Tag-Objekt übergibt, sondern das window-Objekt.

this wird innerhalb der toggle() - Funktion hier mit that bezeichnet.

Die Ausführung des obigen Code-Musters zeigt den Text "Beginn [+] [mehr] Ende" an.

Teste einen [+]-Klick: Wird [+] geklickt, so erscheint "Beginn [-] EINGEBLENDET [mehr] Ende"

Teste einen [-]-Klick: Wird nun [-] geklickt, so erscheint "Beginn [+] [mehr] Ende" an

Teste einen [+]-Klick mit nachfolgende Klicks:
            Wird [+] geklickt, so erscheint "Beginn [-] EINGEBLENDET [mehr] Ende"
    Wird dann [mehr] geklickt, so erscheint "Beginn [-] EINGEBLENDET [weniger] Ende"
    Wird dann [-] geklickt, so erscheint "Beginn [+] [weniger] Ende"

Ein Aufruf toggle(this,'MY_ID') hat undefinierte Parameter visu, s1, s2. Ein solcher Aufruf toggle(this,'MY_ID') verwendet dann für s1 = '[-]'; für s2 = '[+]'; für visu = 'block';