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?
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?
Share Improve this question edited Feb 25, 2019 at 15:43 Martijn Pieters 1.1m321 gold badges4.2k silver badges3.4k bronze badges asked Dec 3, 2016 at 12:21 user5895337user5895337 3- 1 I thought CSS gave priority to the most specific selector – Grezzo Commented Dec 3, 2016 at 12:23
- If your question ahs been answerd, you should accept one of these answers now, or explain what more you need to know – Grezzo Commented Dec 5, 2016 at 9:56
- 1 @Grezzo sorry i could not find it then but now I accepted. – user5895337 Commented Feb 2, 2017 at 18:05
4 Answers
Reset to default 2It 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 plicated, 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 es 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
- parse tags
- finds javascript
- (optional)download javascript
- stop parsing html
- parse js
- excecute js
- resume parsing html
- finds javascript
- (optional)download javascript
- stop parsing html
- parse js
- excecute js
- resume parsing html
- etc
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 es 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
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1745197151a4616151.html
评论列表（0条）