How to dynamically create and remove a div using js

How to dynamically create and remove a div using js

This article describes how to dynamically create and remove a div using js. Share it with you for your reference. The specific implementation method is as follows:

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

// Create a div Function createDiv (){ If (document. getElementByIdx_x ("newD ")! = Null) Document. body. removeChild (document. getElementByIdx_x ("newD ")); Var Div = document. create_rElement ("div"); // create a div Div. setAttribute ("id", "newD "); Div. style. position = "absolute "; Div. style. height = "160px "; Div. style. width = "400px "; Div. style. border = "1px solid gray "; Div. style. background = "white "; Div. style. paddingTop = "40px "; Div. style. zIndex = "100 "; Div. style. left = 100 + "px"; // note that "px" must be added in Firefox" Div. style. top = 100 + "px "; Div. style. textAlign = "center "; Div. style. fontSize = "18px "; Var str = "<div id = \" divClose \ "onclick = \" removeDiv () \ "style = \" width: 16px; height: 16px; float: right; margin-top:-40px; background: url (images/divClose.gif); \ "> <\/div> "; Div. innerHTML = str + title; Document. body. appendChild (newD ); } // Remove the created div Function removeDiv (){ Document. body. removeChild (document. getElementByIdx_x_x ("newD ")); }

I hope this article will help you design javascript programs.