I have an external JavaScript file linked by blogger. I want to change valuess in it. (css values assigned with JavaScript)
Is it possible to run the same code in head or body with different values assigned with JavaScript? For example, CSS gives least priority to the external CSS stylesheets and assigns the properties which are given inside the file.
Does JavaScript have any priority system like that?
It is not priority, but execution order. Javascript is not involved in any sort of prioritising or doesn't have anything like specificity in CSS to even have a need for it.
Javascript code is executed in the order it is included in the HTML document irrespective of whether it is inline or external js, although events makes things a bit more complicated, we can schedule code to be run later on certain events like 'load' event of window. So it is easy to make sure your code is run after theirs, but if they are say changing style from onload event handler, then you have to add your code to the same event itself. (Order of event handlers are ensured in DOM3 at least in specification)
But, have you tried !important in CSS, it can override inline styles and comes handy in some scenarios like this. But if you are able to remove the styles using JavaScript well and good.
Javascript code is executed at the point of inclusion.
Html parser
Watch out for things like code that hooks itself to domready events, to only be fired when the document is done loading or other events, then it comes down to in which order they were registered.
There are also things like defer and async, which will make it load/execute in parralel to parsing(details and supporr vary per browser). But in most scenarios without heavily modified templates in google blogs the sequesce i laid out will happen
JS is executed as soon as it is loaded, so putting your script after theirs (either linking to an external file after, or putting it inline), it will be able to change things in the first script, but it may have executed by then.
You might be able to override parts of it, if their script wait for something before running, like the DOM ready event
if you have tow function with same name, one in head and another one in an external .js file and both of them write a value in <a>, the result will be from the internal one, let's look at an example
<html>
<head>
<script src="myscripts.js"></script>
<script type="text/javascript">
function test(){
document.getElementById("tester").innerHTML="Internal";
}
</script>
</head>
<body onload="test()">
<a id="tester"></a>
</div>
</body>
</html>
-------------------------------------
in myscripts.js
function test(){
document.getElementById("tester").innerHTML="external";
}
-------------------------------------
when the page run it shows:
Internal
