How can I remove a class within an iframe using the onload function only and not javascript

Question

How can I remove a class within an iframe using the onload function only and not javascript and such?

My coding for the iframe is

<iframe height="182" onload="this.height=this.contentWindow.document.body.scrollHeight;" scrolling="no" src="(html site I'm working with, same domain)" width="100%" frameborder="0"/>

I've heard about removeClass() but not sure how to implement that into the iframe with onload. Thanks in advance

Note* the div only has a class, not an id (example class is 'd2l-action-buttons')

The `onload` attribute _is_ Javascript. I'm not sure what you're asking for here. — , Oct 01 '17 at 17:56
A way to have it within the itself and not under <script> setups</script> — Toreono, Oct 01 '17 at 17:58
remove class of an element inside the iframe or a class of the iframe itself? — Amr Elgarhy, Oct 01 '17 at 17:58

Amr Elgarhy · Answer 1 · 2017-10-01T18:38:25.630

0

It is the same like writing inside the script tag see here: Removing class from a Div in Javascript
Remove CSS class from element with JavaScript (no jQuery)
Just write it inside the onload attribute instead, so it will be something like:

<iframe height="182" onload="this.height=this.contentWindow.document.body.scrollHeight;
    this.contentWindow.document.querySelector(".active").classList.remove("active");" scrolling="no" src="(html site I'm working with, same domain)" width="100%" frameborder="0"/>

Query Selector

edited Oct 01 '17 at 18:38

answered Oct 01 '17 at 18:03

Amr Elgarhy

66,568
69
184
301

Is it possible to do the same thing, just without the getElementById? the divs I'm trying to remove, none have Ids, just classes – Toreono Oct 01 '17 at 18:11
Yes use this instead: .querySelector(".active"); as it is listed here https://stackoverflow.com/a/16154694/20126 – Amr Elgarhy Oct 01 '17 at 18:12
so instead of this.contentWindow.document.getElement...... use this.classlist.remove(classname)? – Toreono Oct 01 '17 at 18:14
I updated the code to be as it should be per your comment. – Amr Elgarhy Oct 01 '17 at 18:34
thanks, and where it says 'active' just replace it with the actual class name? (example 'd2l-action-buttons') – Toreono Oct 01 '17 at 18:36
Yes exactly, for sure – Amr Elgarhy Oct 01 '17 at 18:37
https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector – Amr Elgarhy Oct 01 '17 at 18:37

score 0 · Answer 2 · answered Oct 01 '17 at 18:15

0

you'll get ifram document by frames['your frame name'] try this.

<iframe height="500" name="utm"
  src="schould be same domain" onload="Inside_iFrame">
</iframe>

function Inside_iFrame(){
            console.log($(this, frames['utm']))
            var framDocument=$(this, frames['utm'])
            framDocument.find('your element').removeClass('your class')
        };

answered Oct 01 '17 at 18:15

Uttam Ughareja

842
2
12
21

where does the "function Inside......." go? Just after the or in a – Toreono Oct 01 '17 at 18:21
before/after, just outside the iframe. even you can try it on console – Uttam Ughareja Oct 01 '17 at 18:23
alright, and in regards to the 'your element', there are no ids on the divs, just classes – Toreono Oct 01 '17 at 18:24
ok then, inside the iframe from which from element you want to remove class?, if the class is being used at one place the can find by same class you want to remove .find('your class').removeClass('your class') – Uttam Ughareja Oct 01 '17 at 18:25
Yeah, the element is within the iframe, and the div I want to remove only has a class name. Edited the original question with example class name – Toreono Oct 01 '17 at 18:28
is there a way to directly implement that into the iframe brackets itself? like – Toreono Oct 01 '17 at 18:34
you can use this key word like onload=this.document.find('your class').removeClass('your class'), not sure. but it shuold be inside function like onload="function(){ this.document.find('your class').removeClass('your class'); }" – Uttam Ughareja Oct 01 '17 at 18:40

How can I remove a class within an iframe using the onload function only and not javascript

2 Answers2