But I am so used to getting an element by id I had never used it as far as I am aware.
Just had a quick google. And it seems to confirm what I suspected that just using the node id like this is not recommended.
When I realised I could do this I thought that that possibly would mean I could return anything that was defined as foo.
It think this was why getElementById was introduced. Which will return only an element with the attribute ID that is foo and not just any var that is foo
I'm not sure what you mean, so I went back and looked...
Well, I did run into a problem with working with elements by not using Hype's API. The problem was when I was using numbers as ID names. The following doesn't work because it returns a syntax error.
1.innerHTML = "Hi!"
SyntaxError: At least one digit must occur after a decimal point
Apparently, element IDs with numbers are allowed in HTML5, but it doesn't work with JavaScript written in that way. I wrote to @jonathan about it, thinking it might be an error with Hype, but he says that the syntax was wrong.
That surprised me, as I don't see what's so bad about it... aside from not being able to use numbers. This is a common theme in development... there's "It works" and "It works well". HA HA.
I am not sure this is the best example of what I mean.. But
In general, use the Hype API hypeDocument.getElementById('') or the general JS API document.getElementById('')
when targeting an element by it's id. ( use the hype one when using hype where possible)
Don't just use the id without using either of the getElementById functions which employ type Of identification.
Simple Example of why:
I have a Text element with the ID of textToChange
in some function I have also defined a var with the same name as that ID.
var textToChange = "llalala"
Now in function I want to change the text of the element using:
I think I got confused by the title of this thread...
Do not need use hypeDocument.getElementById to get Element.
That statement alone is true. You don't need to use the Hype API.
What you're saying is don't just use the element ID name by itself because your code can break. That's true. It can. I didn't quite understand why, but after reading this thread I started testing.
test = "Hey!";
test.innerHTML = "Hi!";
That breaks because JavaScript doesn't know the difference between the variable name and the element ID name... which are both the same.
But even if you keep your variables and element ID names unique, you can still get into trouble...
x = 5x5;
test.innerHTML = "Hi!";
That trips a syntax error too – even though the element ID name is unique and not a number.
What are you hoping to do here? Multiplication is denoted by an Asterix not "x"
I agree it gets annoying to have to assign an element to a variable especially when I use the same name as it's ID cause it makes sense to use that name:
var box1 = document.getElementById("box1"); // why would I use another name as it's obvious :)
Not using getElementById (whether the recommended hypeDocument variant when working with Hype animations or document variant), is a very bad idea from a programming standpoint. I’d type up the reasons but this article summarizes it well: