如何修改alert样式

1、如何修改aler样式只能自定一个弹窗样式首先必须明白的一点是，aler只是一个方法，而这个方法内部是ate,这是我们无法修改的部分，而最终暴露的只有这个aler彷法名字而已,你甚至拿不到alert的属性，因此要真正意义上的做到修改aler样式是不可行的。有了以上这个条件基础，我们能做的只有重写aler方法，替换掉系统自带的aler方法。一行代码替换alert方法alertt看到这，就有很多人已经明了了，首先你可以先写好一个假的弹窗样式，然后通过这种方式显示出来，这种是tl三方同时更改达到效果，你也可以全部都JaaSI去完成结构样式的操作，今天我们的示例就是全部通过来完成结构样式控制。明确了基本

2、方式是通过替换alert方法，那么就开始进一步的思考实现步骤。实现自定义alert方法的步骤确定弹窗样式结构结构插入样式控制点击确定删除结构确定结构aler容确定使用JS处理结构于是有了下面这段代码:alertalertalertataaratexta.a将l标签插入外围a.a将按钮插入外围reate创建:最外围标签reate创建me示内容的标签reate创建按n钮标签reate创缝一个文字节点ata确定te创建文字曲内部结构套入将需要显示的内容节点插入标签内l将按钮文字插入按钮标签整/体显示到页面内进行赋值，如果用这种方式写的话，在就可改成这里为什么不直接用方法呢，这里考虑预编译时并不会对之

3、前调用还会是系统自带。当你初步调用时，如果不传参数会报错，那么我们需要一个的判断，优化当前的JSB接下来我们会发现，我们还缺少样式和确定关闭功能。这里完全可以用级事件绑定。代码很快变成了这样:确定内部结构套入整体显示到页面内确/定绑定点击事件删除标签样式控制还剩下最后一个样式控制问题。为了写起来更美观更方便，我们需要写一个方法来控制样式。这样我们就可以通过如下方式控制样式:retext-align”:“centerwaitwait,还没完测试后发现，如上的这种样式书写方式，下面有渲染问题，那我们换成。所以，样式控制代码改为.functioncss(targetO.varstr=targetOb

4、j.getttribute(style)?targetObj.getAttribute(style.for(variin.str+=i+bji+;targetObj.style.cext=str;这样咱就解决的尴尬了，但是同时也带来了其他问题，字符串拼接，有可能会出现重复属性，因此如果你需要做一个通用的，还需要对字符串进行查重，但对于本例来说完全够用了。完成版的aier功能我们的e就成了这样（样式还是自己调吧，下面的样式只是做个示范）headetaarettitle学堂alerttitle/headwialertalerttialert(dataarareateElementreateElem

5、entreateElementt.extreateTexte(dataata控/制样式itiixeleftrea确定ettop:20%,width:100px,margin:0auto,background-color:#f00,font-size:20px,text-align:center);css(btn,background:blue,)/内部结构套入p.appendChild(textNode);btn.appendChild(btnText);a.appendChild(p);a.appendChild(btn);/整体显示到页面内document.getElementsByTag

6、Name(body)0.appendChild(a);/确定绑定点击事件删除标签btn.onclick=functiona.parentNode.removeChild(a);functioncss(targetObj,cssObj)varstr=targetObj.getAttribute(style)?targetObj.getAttribute(style):for(variincssObj)str+=i+:+cssObji+;targetObj.style.cssText=str;alert(123);最后总结下，本例运用到的知识点，DOM操作、预编译期与执行、for-in盾环，cssText。本文的主要目的在于引导思路，无论做什么项目，思路很重要，要懂得变通，如果你想通过某