Question

The website I’m talking about: https://sephir.ch/vfi/user/lernendenportal/index.cfm

I wanted to make a simple bookmarklet which fills my email and password into those two textboxes. My JS code works on any other site, but not on this one.

HTML:

 <input type="text" name="email" size="40" maxlength="60" class="tdschwarz" autocomplete="off">

JS:

 javascript:function fill() {alert(document.getElementsByName("email")[0].value);} fill();

Error:

 Uncaught TypeError: Cannot read property 'value' of undefined 

Do you guys have any ideas why it doesn’t work? Thanks in advance.

Answer 1

Because the email field is within a frame, so the document object is not the same of the field’s.

In order to access to that field, first you must obtain the document object it belongs to. Inspecting the DOM, you have to access to the #mainFrame frame:

var frame = document.getElementsByName("mainFrame")[0];

Now you can get the element:

var email = frame.contentDocument.getElementsByName("email")[0];

This works in modern browsers. In IE8 and older, there’s this nice document.frames property that can make things easier:

var email = document.frames.mainFrame.document.getElementsByName("email")[0];