Menu
Hello. I’m trying to familiarize with using DOM. I’ve done a lot of javascript and I used to avoid it, aside from using basic document functions (document.getElementByID, document.getElementsByName). I do a lot of dynamic building on pages..i.e. my pages allow addition of more elements on user request, for which DOM seems well suited for. I never used it though but instead always used (some div).innerHTML +=”(new element code)”.
A major drawback I find in creation with DOM is the excess amount of code I would need to create everything. For example, suppose I had a div container IDed by “div1” for which I wanted to add a text input.
Without dom I’d write:
[CODE]
var inputCode = “<input type=”text” name=”textInput” value=”initVal”>”;
document.getFieldById(“div1).innerHTML+= inputCode;
Just a couple of lines of code. But with DOM:
[CODE]
var inputElm = document.createElement(“input”)
inpuElm.setAttribute(“type”,”text”)
inpuElm.setAttribute(“name”,”textInput”)
inpuElm.setAttribute(“value”,”initVal”)
document.getFieldById(“div1).appendChild(“inputElm”)
There is significantly more coding. With more elements that are more complicated, I’d imagine an obscene amount of javascript code using DOM. Is there a way to create an element and all its features in one go by adding all its coding at once, similar to my first approach?
Thanks!