This doesn't work in my browser - is this normal? It only works when I declare the alias for the document Object inside the function someFunc scope.
var pic1 = document.getElementById('pic1');
var someFunc = function () {
pic1.style.left = "100px";
}
Yes. You just need to ensure you are calling someFunc after the pic1 element has loaded on page. On that note, it's best practice to put you JavaScript at the bottom right before the closing body tag.
Check your code out in action - http://jsfiddle.net/dga9k/1/
It's not a scope problem. The probable reason is that you are trying to get the reference to the element before the element has been created. You have to wait until the element has loaded before you can access it, for example using the onload event:
<html>
<head
<title>Test</title>
<script>
function init() {
var pic1 = document.getElementById('pic1');
var someFunc = function () {
pic1.style.left = "100px";
};
someFunc();
}
</script>
</head>
<body onload="init();">
<div id="pic1"></div>
</body>
</html>