Call CSS in Javascript

[Anonymous]

Hi,

I am creating a Safari extension that clears Outlook.com advertisements and other content. I have made two versions of the extension, one with CSS and one Javascript. However, there is a delay when removing the elements with Javascript. I was wondering is it possible to call a CSS file using Javascript so that it removes the elements quicker?

If anyone has made a Safari extension or is familiar with it, how can I make check box that will call a specific CSS file? For example, there is a CSS file called ‘ads’ and I have checkbox with the ‘Key’ ads and I want to be able to find a way so that I can call it when the checkbox has been checked.

I hope you understand what I am trying to say :) It is a bit difficult to write what I want to say.

Thanks.

[__]

I was wondering is it possible to call a CSS file using Javascript so that it removes the elements quicker?

“call” CSS? do you mean, “load a CSS file”? Sure, use document.createElement to create a <link> and set the type, href, and rel attributes.

However, CSS does not “remove” elements. Are you just setting the element’s display properties to “none”?

can I make check box that will call a specific CSS file?

You can add an event listener to that checkbox, so your script can do something when it is checked. Listen for the “change” event.

[Anonymous]

Yes, that is correct. I am setting the display to ‘none’. Here is my javascript, how do I put your code into mine? Thanks.

        if (e.advertisements !='show') {
            var customStyles = document.createElement('style');
            customStyles.appendChild(document.createTextNode('#RightRailContainer {display: none !important;}'));
            document.documentElement.insertBefore(customStyles);

}

[Author]

Posts