本文實例講述了js動態創建及移除div的方法。分享給大家供大家參考。具體實現方法如下:
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
|
//創建div
function
createDiv(){
if
(document.getElementByIdx_x(
"newD"
)!=
null
)
document.body.removeChild(document.getElementByIdx_x(
"newD"
));
var
Div = document.create_rElement(
"div"
);
//創建div
Div.setAttribute(
"id"
,
"newD"
);
Div.style.position =
"absolute"
;
Div.style.height =
"160px"
;
Div.style.width =
"400px"
;
Div.style.border =
"1px solid grey"
;
Div.style.background =
"white"
;
Div.style.paddingTop =
"40px"
;
Div.style.zIndex =
"100"
;
Div.style.left = 100 +
"px"
;
//注意Firefox下必須加"px"
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);
}
//移除創建的div
function
removeDiv(){
document.body.removeChild(document.getElementByIdx_x_x(
"newD"
));
}
|