Access to iframe using classname

Question

<iframe class="class_name">
        <html>

          <head></head>

          <body>

            <div>
              <!-- All of the stuff -->
            </div>

          </body>

        </html>
    </iframe>

How can I access to elements of this iframe?

.frame("class='classname'")

The above doesn't work.

score 1 · Answer 1 · 2018-03-27T09:22:26.867

Although two iframes have the same class, this will hide only the first iframe.

function hide() {
var iframe = document.getElementsByClassName("iframe");
iframe[0].style.display = "none";
}

<iframe class="iframe"></iframe>
<iframe class="iframe"></iframe>
<br>
<button onclick="hide()">Hide 1st Iframe</button>

What does this code does?

document.getElementsByClassName("iframe") gets all the elements with the class iframe and set the elements as the value of a variable named iframe. The number inside [] defines one element of the many. If the number inside [] is 0, the first element out of the group of elements is defined. After [], you can set the property you want.

score 0 · Answer 2 · answered Mar 27 '18 at 07:47

0

Try with an id

<iframe id="your_id">

and use

.frame('your_id')

answered Mar 27 '18 at 07:47

marcdecline

186
4
22

But I haven`t got an id, only the classname. Is it impossible to access iframe using only classname? – Devegnik Mar 27 '18 at 07:58

score 0 · Answer 3 · answered Mar 27 '18 at 08:04

But here it will not work because of the security policy. Try it on your machine. Read more about X-XSS-Protection.

var frame = document.querySelector(".myframe");

var content = frame.contentDocument;

console.log(content);

<iframe class="myframe" width="560" height="315" src="http://www.weather.gov/" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

score 0 · Answer 4 · answered Mar 27 '18 at 14:50

Assuming that you are using nightwatch - I see you're using .frame() and that is the Nightwatch method for selecting iframes - you cannot switch to an iframe by class, but you can use an index or by name if the element has a name attribute.

These posts should help:

Can't select an Iframe in selenium webdriver

Selecting nested iframe - selenium / javascript / node-js

Access to iframe using classname

4 Answers4