Can a block enable loading of css/js? [duplicate] - javascript

This question already has an answer here:
How to attach js/css to a StreamField block when it is rendered?
(1 answer)
Closed 4 years ago.
I want to create a block that is going to utlize some js/css from a CDN, and possibly some custom js code just before the </body>. I do not want these loaded unless the block is used on the current page. Is there a way I can check if the block has been used, or even better, have the block tell the base.html file that it is being used?

If you already have jQuery in your project, the easiest way to do this will be with getScript. Documentation is here: https://api.jquery.com/jquery.getscript/
With plain JS, you have to jump through slightly more hoops and create a <script> tag that you then append to the document:
var dynamically_loaded_js = document.createElement('script');
dynamically_loaded_js.setAttribute('src','http://example.com/dynamically_loaded.js');
document.body.appendChild(dynamically_loaded_js);

Related

Why would a <script> tag contains HTML comments in it? [duplicate]

This question already has answers here:
Are HTML comments inside script tags a best practice? [closed]
(10 answers)
Closed 2 years ago.
In this app I'm working on I see this pattern a lot:
<script type="text/javascript">
<!--
doStuff();
//-->
</script>
What purpose might those comment tags serve? Can I safely remove them?
In ancient times some browsers didn’t understand the <script> tag so it was made in a way that you can add comments to the beginning without issues. This causes anything inside to not be shown on the page if the browser doesn’t know what to do with the tag.
This hasn’t been needed in a very long time so it’s safe to remove them.

Determine when DOM Loaded [duplicate]

This question already has answers here:
execute function after complete page load [duplicate]
(16 answers)
Closed 3 years ago.
I am in need of some JS assistance.
I need to run some code after the DOM was updated.
For example: when I click a button, it fires a function. I need to run that function code and when the DOM is fully updated, run some more code. How could I go about doing this in a clean fashion?
I am sure this is relatively simple but I am drawing blanks. I am using jQuery.
$('.btn').click(function() {
do some stuff
// then ensure dom has fully updated and do some more????
})
DOM updates are synchronous. Just put the code where your comment is.

how to write css for inner html of iframe [duplicate]

This question already has answers here:
How to apply CSS to iframe?
(28 answers)
Closed 8 years ago.
have one question, i trapped in a prob..The problem is like that --->I have to manipulate the css of inner html of iframe but the content of this iframe is not coming from same domain so how can it makes possible
live eg.-u can take ("tweets feed in our website ,it comes from another domain tweeter.com/bla....blaa but render on our web page encapsulate with iframe,so how can i style tweet section in our website")
i have tried by jQuery but its not working can u plz help me out in that ?
Thanks in advance Smile | :)
The comment by Sico refers to an existing question on stack that answers this as not possible. How to change style of iframe content cross-domain?
If you are looking to do this in Javascript or JQuery that answer is correct, basically. You Cannot. It is not possible to alter the content of another domain.
A solution however, would be to use PHP to fetch the content of the target page and make it your own, there are several ways to do this such as curl http://php.net/manual/en/book.curl.php. You can then redisplay that content in any manner you like and apply any style you like. You can even ditch the iframe and inline it right into the rest of your content.
Be warned however, depending on the source domain, they may not approve of their content being re-used in this manner.

Does JavaScript have an order of precedence like CSS? [duplicate]

This question already has answers here:
load and execute order of scripts
(6 answers)
Closed 9 years ago.
Does JavaScript behave like CSS in that on-page scripts will take a higher precedence over external scripts? The reason I ask is because I am wondering if I can override an external script's commands to change a CSS attribute on expansion of a mobile nav bar.
You cannot really override anything that a previous script adds to a DOM element.
It will run, and then you just have to do something else to it.

Do we still need <!-- //--> in JavaScript block [duplicate]

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Using HTML comment tag <!— --> still relevant around JavaScript code?
Kind of remember <!-- //--> is used to prevent JavaScript code from being displayed in a lower version of IE. Anyone can provide a link to the article explaining this? Hard to search "<!--" in Google, because it's got stripped off.
And do we still need this in JavaScript block?
Thanks!
Those comments were used when Javascript was first introduced. They are not needed any more, and haven't been for quite a while.
The purpose was to hide the script from browsers that didn't even know what the script tag was for. Those browsers would ignore the script tag and show the code inside as regular HTML content.
There are no browsers left that don't know about the <script> tag, so even if they don't run the script, they still don't show the code inside.
Only if you're worried about time-travellers from somewhere back in last milennium coming to the present day with their old computers.

Categories

Resources