更改alert样式

        window.alert = alert;
        function alert(data) {
            // 创建元素
            var a = document.createElement("div"),
                div1 = document.createElement("div"),
                div2 = document.createElement("div"),
                h3 = document.createElement("h3"),
                p = document.createElement("p"),
                btn = document.createElement("div"),
                h3Text = document.createTextNode("提示");
                textNode = document.createTextNode(data ? data : ""),
                btnText = document.createTextNode("确定");
            // 控制元素样式
            css(div1, {
                "width": "100%",
                "height": "100%",
                "position": "fixed",
                "left": "0",
                "top": "0",
                "bottom": "0",
                "right": "0",
                "margin": "0 auto",
                "z-index": "999998",
                "background-color": "#666666",
                "opacity": "0.5"
            });
            css(div2, {
                "width": "472px",
                "height": "160px",
                "min-height": "160px",
                "max-height": "500px",
                "position": "fixed",
                "background-color": "#fff",
                "top": "0",
                "right": "0",
                "left": "0",
                "bottom": "0",
                "margin": "auto",
                "text-align": "center",
                "z-index": "999999"
            });
            css(h3, {
                "background": "#FF0000",
                "margin": "0",
                "line-height": "54px",
                "color": "#fff",
                "text-align": "center"
            });
            css(btn, {
                "cursor": "pointer",
                "background-color": "#146AC0",
                "color": "#ffffff",
                "border": "1px solid #c5c5c7",
                "width": "102px",
                "height": "40px",
                "line-height": "40px",
                "border-radius": "5px",
                "margin-left": "40%"
            });
            // 内部结构套入
            h3.appendChild(h3Text);
            p.appendChild(textNode);
            btn.appendChild(btnText);
            div2.appendChild(h3);
            div2.appendChild(p);
            div2.appendChild(btn);
            a.appendChild(div1);
            a.appendChild(div2);
            // 整体显示到页面内
            document.getElementsByTagName("body")[0].appendChild(a);
    
            // 确定绑定点击事件删除标签
            btn.onclick = function() {
                a.parentNode.removeChild(a);
            }
        }
        function css(targetObj, cssObj) {
            var str = targetObj.getAttribute("style") ? targetObj.getAttribute("style") : "";
            for(var i in cssObj) {
                str += i + ":" + cssObj[i] + ";";
            }
            targetObj.style.cssText = str;
        }

在这里插入图片描述

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值