2016-03-25 15 views
1

Ich möchte mit onfocus Ereignis auf Seite experimentieren: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onfocusZugriff auf Elemente auf w3school-Seiten über die Chrome-Entwicklerkonsole

Ich benutze Chrome Developer Console (Strg + Umschalt + I). Wenn ich versuche, das Eingangselement zuzugreifen, indem Sie in der Konsole eingeben:

document.getElementsByTagName("input") 

ich zwei versteckte Eingabeelemente anstelle des Texteingabeelement. Screenshot Bild: http://i.imgur.com/zGBsZWY.png Also, was ist hier los, und wie kann man diese Elemente auf den "tryout" Seiten zugreifen?

+1

Ich glaube, sie nutzen iFrames auf W3Schools für ihre Tryout Seiten, was bedeutet, dass die Elemente sind nicht verfügbar, ohne zuerst auf den iFrame zuzugreifen. Sie müssen sich aus diesem Blickwinkel nähern. – David

Antwort

0

@David ist richtig, jeder iframe ist ein separater Javascript-Kontext.

Wenn Sie Javascript in Zusammenhang mit einem iframe ausführen möchten, sehen this question

Alternativ Sie Element Picker von Chrome Dev-Tools (Ctrl-Shift-c) und dann in der Konsole Typ $0 verwenden kann, wird es zurückkehren das letzte fokussierte Element. Wenn Sie dann etwas anderes konzentrieren, können Sie $0 auf die neu fokussierte Element verwenden, $1 für konzentrierte sich bisher ein usw.

Siehe Dev Tools command line API

+0

Blockierte einen Frame mit dem Ursprung "http://www.w3schools.com" vom Zugriff auf einen Ursprungsrahmen. – Konstantin

+0

Thx, jetzt funktioniert es, ich muss nur den richtigen Iframe-Kontext aus dem entsprechenden Dev-Tools-Menü auswählen. Mein Problem ist jetzt, dass, wenn ich "focus()" für das Texteingabeelement aufruft, der onfocus-Ereignishandler nicht ausgelöst wird. Was kann das Problem sein? – Konstantin

+0

Ich denke, die '.focus()' Methode gibt nur den Fokus auf das Element, führt aber die Listener nicht aus. Sie können '.onfocus()' ausführen, um den registrierten Listener direkt auf einem Element aufzurufen, oder Sie versuchen [ein Ereignis zu senden] (https://developer.mozilla.org/en-US/docs/Web/API/ EventTarget/dispatchEvent) –