JavaScript はシステムのポップアップ ボックスをシミュレートするので、DOM の操作を練習できます。

最近一段时间里，闲着无事，顺便写了个小demo练了练手，来操作dom，分享之。
HTML：
 
"http://www.w3.org/TR/html4/loose.dtd">

   
       
       
       
   
   
       

       

                               

JavaScript ：

/**
* @著者xiangwenwen
 */
varindex = {
//初化
int:function(){
//body高
var body = document.body;
var bodyHeight = body.scrollHeight;
/ /onclick父容器
var on = document.getElementById("on");
on.style.position = "relative";
on.style.zIndex = "5";
//状態态父容器
var min = document .getElementById("min");
min.style.display = "none";
min.style.position = "absolute";
min.style.zIndex = "10";
min.style.height = bodyHeight + "px";
min.style.display = "none";
//透明层 www.2cto.com
var dodiv = document.createElement("div");
dodiv.setAttribute("id","opmint" ）;
min.AppendChild（dodiv）; .style.background = "#000";
//垂直居中div1
var div = document.createElement("div");
div.setAttribute("id","admint");
min.appendChild(div) ;
var admint = document.getElementById("admint");
admint.style.position = "absolute";
admint.style.width = "300px";
admint.style.height = "50px";
管理者t. style.border = "4px ソリッド #963";
admint.style.top = "50%";
admint.style.left = "50%";
admint.style.marginTop = "-25px";
管理者。 style.marginRight = "0px";
admint.style.marginBottom = "0px";
admint.style.marginLeft = "-150px";
admint.style.display = "none";
//关闭按钮1
変数a = document.createElement("a");
a.setAttribute("href","#");
a.setAttribute("id","close");
admint.appendChild(a);
        var aclose = document.getElementById("close");
aclose.innerHTML = "关闭";
aclose.onclick = function(){
admint.style.display = "none";
min.style.display = "none ";
}
//垂直居中div2
var div2 = document.createElement("div");
div2.setAttribute("id","addiv2");
min.insertBefore(div2,min.childNodes[ 2] );
var addiv2 = document.getElementById("addiv2");
addiv2.style.position = "absolute";
addiv2.style.width = "300px";
addiv2.style.height = "50px";
追加iv2 .style.border = "4px ソリッド #789";
addiv2.style.top = "50%";
addiv2.style.left = "50%";
addiv2.style.marginTop = "-25px";
addiv2 .style.marginRight = "0px";
addiv2.style.marginBottom = "0px";
addiv2.style.marginLeft = "-150px";
addiv2.style.display = "none";
//关闭按钮2
var a2 = document.createElement("a");
a2.setAttribute("id","a2close");
a2.setAttribute("href","#");
addiv2.appendChild(a2);
var a2close = document.getElementById（ "a2close"）; ;
}
},

//背景透明
setOpacity:function(node,level){
ノード = ノードのタイプ == "文字列" ? document.getElementById(node) :node;
if (document.all) {
node.style.filter = "alpha(opacity ="+ level +")";
} else{
node.style.opacity = level / 100;
};
},

//初期化点击状態态
OnclickAll:function(){
var onmin = document.getElementById("min");
var onck = document.getElementById ("オン");
var adon = onck.getElementsByTagName("a");
var adclose = document.getElementById("admint");
var acclose = document.getElementById("addiv2");
adon[0].onclick = function(){
onmin.style.display = "block"; .display = "ブロック";
}
}
}

dom の追加、削除、変更、クエリについては、メソッドは、挿入されるノードとノードの 2 つのパラメーターを指定した replaceChild() に変更はありません。交換されることになります。このメソッドは、削除後にノードを置き換えるために使用されます。ノードを置き換えたくない場合は、ノードを削除して、removeChild() を直接使用するだけです。



勤勉は仕事の優秀さにつながりますが、遊び心は無駄につながります。行動は考えることによって達成され、従うことによって破壊されます。新しい人の成長を要約すると、次のようになります。すべての記事と例は自己概要のみであり、学習とコミュニケーションのみを目的としています。