废话不多说了,直接给大家贴代码了,具体代码如下所示:
<script> window.alert = alert; function alert(data) { var maindiv = document.createelement("div"), p = document.createelement("p"), allpage = document.createelement("div"), btn = document.createelement("div"), textnode = document.createtextnode(data ? data : ""), btntext = document.createtextnode("确定"); // 控制样式 css(allpage, { "position": "fixed", " _position": "absolute", " width": "100%", "height": "100%", "left": "0", "top": "0", "background": "rgba(0, 0, 0,0.5)", "-moz-opacity": "0.5", "filter": "alpha(opacity=50)", "z-index": "97", }); css(maindiv, { "position": "fixed", "left": "0", "right": "0", "top": "30%", "width": "14rem", "height": "5rem", "padding-top":"0.5rem", "margin": "0 auto", "background-color": "white", "font-size": "0.75rem", "text-align": "center", "position": "relative", "border-radius": "5px 5px 5px 5px", }); css(btn, { "background": "#de241b", "color": "white", "width": "6rem", "margin-left": "4rem", "margin-bottom":"0.25rem", "height": "1.5rem", "border-radius": "5px 5px 5px 5px", "position": "absolute", "padding-top":"0.5rem", "bottom":"0", }) // 内部结构套入 p.appendchild(textnode); btn.appendchild(btntext); maindiv.appendchild(p); maindiv.appendchild(btn); allpage.appendchild(maindiv); // 整体显示到页面内 document.getelementsbytagname("body")[0].appendchild(allpage); //禁止滚动 $("body").on("touchmove", function (event) { event.preventdefault; }, false) // 确定绑定点击事件删除标签 btn.onclick = function () { allpage.parentnode.removechild(allpage); //启用滚动 $("body").off("touchmove"); } } 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; }
以上所述是小编给大家介绍的使用javascript实现alert的实例代码,希望对大家有所帮助
如对本文有疑问, 点击进行留言回复!!
offset、client、scroll (width,height、left,top、X,Y)
网友评论