guys if i use appendChild()
var node = document.createElement(“LI”);
var textnode = document.createTextNode(“Water”); node
node.appendChild(textnode);
document.getElementById(“myList”).appendChild(node);
instead of adding any element and its value directly in html
how will it be different from the one element added using js appendChild()
i mean are there are resourcse u guys know that could tell me the difference between the from the browser’s perspective
how browser executes the html element and js element differentyl?
assuming you have your <script> tag at the end of the page:
The browser renders and paints HTML, then reads <script> code, and creates element in existing HTML.
The situation is practically harmless, it lasts microseconds. The only exception is when you generate a lot of elements with JS. Then the script will take longer to execute and the display of generated elements will be delayed.
Was that the answer to your question? If you need more specifics, I don’t think I am capable to deliver you answers 
1 Like
that i know
place scrtipt tag at the end of the html page
but what im asking is how is the appendChild() element different than html elements
how do both of them are different to a browser
i need some resources on this
how both of them r differnt with respect to the browser wehn it renders them
The thing is, you sometines NEED to create and append elements with Javascript. Imagine you create a todo list for the user to write an input. You’ll have to write the necessary JS to create and append that element dinamically. If you can write HTML in the HTML document do so by all means, and use createElement and append when you need to generate elements dinamically, elements that a user create and elements that are added AFTER the initial HTML is rendered.
I know it’s not what you are asking, but my point is, you are describbing two different situations and each approach requires a method, it’s not like you can hardcode everything.
If you want to know exactly how things perform you would need to do a performance test with a site like https://jsperf.com
1 Like