javascript add html element code example
Example 1: add element to body javascript
var elem = document.createElement('div');
elem.style.cssText = 'position:absolute;width:100%;height:100%;opacity:0.3;z-index:100;background:#000';
document.body.appendChild(elem);
Example 2: how to add elements in javascript html
var tag = document.createElement("p");
var text = document.createTextNode("TEST TEXT");
tag.appendChild(text);
var element = document.getElementsByTagName("body")[0];
element.appendChild(tag);
Example 3: javascript add div
<div id="new">
<p id="p1">Tutorix</p>
<p id="p2">Tutorialspoint</p>
</div>
<script>
var tag = document.createElement("p");
var text = document.createTextNode("Tutorix is the best e-learning platform");
tag.appendChild(text);
var element = document.getElementById("new");
element.appendChild(tag);
</script>
Example 4: js create element
var newDiv = document.createElement("div");
document.body.appendChild(newDiv);
Example 5: Inserting HTML elements with JavaScript
function create(htmlStr) {
var frag = document.createDocumentFragment(),
temp = document.createElement('div');
temp.innerHTML = htmlStr;
while (temp.firstChild) {
frag.appendChild(temp.firstChild);
}
return frag;
}
var fragment = create('<div>Hello!</div><p>...</p>');
document.body.insertBefore(fragment, document.body.childNodes[0]);