由于本人以前是.net程序员，所以即使现在在做前端，也习惯于用面向对象的方式编写js脚本，我想如果你以前也是或者现在还是名第三代程序员的话，应该对此并不陌生。

　　说到js的面向对象，就不得不提到prototype这个js内置属性了(注意：这里的prototype可不是prototype.js),它的作用就是可以动态的向一个对象(object)添加某种属性。我现在要做的就是尽可能的让代码达到公用，像继承啦之类的。好了，这些就不多说了，对prototype不了解的可以搜索下相关内容。

　　今天要做的是点击一个html元素让其弹出一个友好的对话框来，首先要明确两点，一点是我可能会大量的用到这种方式，甚至不希望出现系统的alert或confirm，第二点就是弹出的内容尽量的可以多种化，甚至可以自定义。明确这两点后，我们就可以写js代码了，都是些很初级的东西，如果你要鄙视的话就尽情的鄙视我吧!^.^

　　首先定义一个简单的对象:

　　function objDIV() {

　　this.bgdiv ;

　　this.infodiv ;

　　}

　　首先，我们希望弹出一个遮罩层，我给它命名openBackDiv();

　　function openBackDiv(txbdiv) {

　　txbdiv.bgdiv = document.createElement("div");

　　txbdiv.bgdiv.setAttribute("id", "overDiv");

　　txbdiv.bgdiv.innerHTML = "";

　　}

　　再者，把它添加到刚刚定义的对象的prototype里去(openBG()):

　　objDIV.prototype.openBG = function() {

　　openBackDiv(this);

　　document.body.appendChild(this.bgdiv);

　　this.bgdiv.style.display = "block";

　　this.bgdiv.style.width = document.documentElement.clientWidth + "px";

　　this.bgdiv.style.height = document.documentElement.scrollHeight + "px";

　　}

　　再就是添加弹出信息层的方法,和上面一样做就行了。所以才说这个是很基础的东西，好像确实没啥好说的，直接上代码吧!

　　这是一个正在加载的弹出层，有点粗糙. function openLoadDiv(txbdiv) {

　　txbdiv.infodiv = document.createElement("div");

　　txbdiv.infodiv.setAttribute("id", "div_info");

　　txbdiv.infodiv.innerHTML = "

请稍等，正在处理中...

";

　　document.body.appendChild(txbdiv.infodiv);

　　txbdiv.infodiv.style.width = "550px";

　　txbdiv.infodiv.style.height = "270px";

　　txbdiv.infodiv.style.fontSize = "14px";

　　txbdiv.infodiv.style.position = "absolute";

　　txbdiv.infodiv.style.background = "#fff";

　　txbdiv.infodiv.style.zIndex = "9999";

　　centerobject();//居中的方法

　　}

　　objDIV.prototype.openLoading = function() { this.openBG(); openLoadDiv(this); }

　　做完这些后一个简单的弹出加载层就完成了.是不是有点成就感了，那么接着完成其他的工作吧!既然都弹出了，总得在某个时刻把它们移掉吧，下面就是移除这些层的方法。

　　objDIV.prototype.removeBG = function() {

　　if (this.bgdiv || document.getElementById("overDiv")) {

　　if (this.bgdiv) {

　　document.body.removeChild(this.bgdiv);

　　} else {

　　document.body.removeChild(document.getElementById("overDiv"));

　　}

　　}

　　}

　　objDIV.prototype.removeInfo = function() {

　　this.removeBG();

　　if (this.infodiv) {

　　document.body.removeChild(this.infodiv);

　　} else {

　　document.body.removeChild(document.getElementById("div_info"));

　　}

　　}

　　如果想弹出不同层信息的话，就可以添加不同的prototype属性。