JavaScript dynamically creates HTML elements

JavaScript dynamically creates HTML elements

When ajax is used, JavaScript will be used to dynamically create HTML elements. Here is a simple example:

Analyze the HTML elements first

Red
Line feed

Including the name, attribute, and content of HTML elements

<名称 属性1="“”" 属性2="“”"> Content

The first step is to create a name.

var cFont = document.createElement('font');

Second, Set Properties

cFont.setAttribute("color","red");cFont.setAttribute("size","12");

Part 3 add content

CFont. innerHTML = "red ";

Add Part 4 to the body or other elements (font is in the body)

document.body.appendChild(cFont);

Complete code is attached below

<Script type = "text/javascript"> window. onload = function () {var cFont = document. createElement ('font'); cFont. setAttribute ("color", "red"); cFont. setAttribute ("size", "12"); cFont. innerHTML = "red"; var cP = document. createElement ('P'); cP. innerHTML = "newline"; document. body. appendChild (cFont); cFont. appendChild (cP) ;}</script>

The effect is:
Red

Line feed