JavaScript에서 Alert() 메서드를 다시 작성하는 기술 분석에 집중
window.alert = function(str) { var alertBox = document.createElement("div"); alertBox.id="alertBox"; alertBox.style.position = "absolute"; alertBox.style.width = "400px"; alertBox.style.background = "#F2F2F2"; alertBox.style.border = "1px solid grey"; alertBox.style.left = "50%"; alertBox.style.top = "50%"; alertBox.style.transform = "translate(-50%, -50%)"; alertBox.style.textAlign = "center"; alertBox.style.zIndex = "100"; var strHtml = ""; strHtml += '<div id="title">提示:<div id="close" onclick="certainFunc()"></div></div>'; strHtml += '<div id="content">'+str+'</div>'; strHtml += '<div id="certain"><input id="btn" type="button" value="确 定" onclick="certainFunc()" onhover="hoverFunc()"/></div>'; alertBox.innerHTML = strHtml; document.body.appendChild(alertBox); var title = document.getElementById("title"); title.style.textAlign = "left"; title.style.marginTop = "20px"; title.style.paddingLeft = "20px"; title.style.height = "30px"; title.style.fontSize = "15px"; var close = document.getElementById("close"); close.style.width = "16px"; close.style.height = "16px"; close.style.marginRight = "20px"; close.style.background = "url('images/close.png')"; close.style.float = "right"; var content = document.getElementById("content"); content.style.margin = "20px"; content.style.fontSize = "12px"; var certain = document.getElementById("certain"); certain.style.position = "relative"; certain.style.height = "50px"; certainFunc = function() { alertBox.parentNode.removeChild(alertBox); }; var btn = document.getElementById("btn"); btn.style.width = "60px"; btn.style.height = "30px"; btn.style.background = "#cccccc"; btn.style.border = "1px solid grey"; btn.style.position = "absolute"; btn.style.borderRadius = "5px"; btn.style.right = "20px"; btn.style.bottom = "20px"; btn.style.marginTop = "10px"; btn.style.cursor = "pointer"; btn.style.color = "#333"; hoverFunc = function() { btn.style.border = "1px blue solid"; }; }
위는 제가 컴파일한 JavaScript에서 Alert() 메서드를 다시 작성하는 기술에 대한 핵심 분석입니다. 앞으로도 도움이 되세요.
관련 기사:
기본 JS 캡슐화 페이드 인 및 페이드 아웃 효과 기능 단계에 대한 자세한 설명
vue project_vue.js에서 sass를 사용하는 구성 방법
위 내용은 JavaScript에서 Alert() 메소드를 다시 작성하는 기술 분석에 중점을 둡니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!