I notice that I can define an element id in the inspector and then call it directly in code by just using the id.
For example; I would normally use :
var someFoo = hypeDocument.getElementById('foo') ;
someFoo.innerHTML = "This foo text";
But I discovered ( by accident ; not paying attention to what I was typing) that I can use:
foo.innerHTML = "This foo text";
Is this by design and documented somewhere.
NoGetById.hype.zip (15.1 KB)
Seeing this stuff really wants me to publish my book already. Ha ha. I mentioned this in the book. That's just regular JavaScript.
The more I use Hype, the more I wonder if I need it. I like Hype as a development platform though.
It's the same as jQuery. People use it because it's easy, not necessarily because it's necessary.
You would think I would know that.
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 was talking about the introduction for general JS rather than just in Hype APIs. I understand why we should use the Hype API where possible…
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:
textToChange.innerHTML = "Text Changed"
will not work.
And when I try and get the textToChange's value:
console.log(textToChange);
console.log textToChange.innerHTML);
I will get back "llalala" and not the element's innerHTML.
if I do similar but use the getElementById functions/APIs
var textToChange = "llalala"
textToChange.innerHTML = "Text Changed"
var someFoo = hypeDocument.getElementById('textToChange')
someFoo.innerHTML = "Text Changed"
console.log(textToChange);
console.log(someFoo.innerHTML);
They all will work as expected and I know what is what.
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 :)
It can get tedious
D
Ha ha.
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:
http://tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/
At the end I’m told “If you see others use it tell them to stop, ridicule them, do whatever it takes.” so, uhh… shame on you.