This is because maybe you are trying to access some objects before they are loaded.
Code:
<script type="text/javascript">
document.getElementById('index').innerHTML = 'this is test';
</script>
<div id="index"></div>
will not work, because you try to access the node before it is ready. Instead you must put js after the html, like
Code:
<div id="index"></div>
<script type="text/javascript">
document.getElementById('index').innerHTML = 'this is test';
</script>
Best way to avoid this is to defer execution. Put all in a function and load it after document finished loading.
Code:
<script type="text/javascript">
function inititlaLoad(){
document.getElementById('index').innerHTML = 'this is test';
/*...*/
}
window.onload = inititlaLoad
</script>
or jQuery equivalent (and way better solution)
Code:
<script type="text/javascript">
$(function(){
document.getElementById('index').innerHTML = 'this is test';
/*...*/
})
/* make sure to include jQuery library in order for this to work */
</script>
In the last 2 examples you can put HTML code and JS code wherever you want in the page.
Bookmarks