JavaScript에서 Alert() 메소드를 다시 작성하는 기술 분석에 중점을 둡니다.

亚连
풀어 주다: 2018-05-17 10:02:28
원래의
2459명이 탐색했습니다.

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 += &#39;<div id="title">提示:<div id="close" onclick="certainFunc()"></div></div>&#39;;  
    strHtml += &#39;<div id="content">&#39;+str+&#39;</div>&#39;;  
    strHtml += &#39;<div id="certain"><input id="btn" type="button" value="确 定" onclick="certainFunc()" onhover="hoverFunc()"/></div>&#39;;  
    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(&#39;images/close.png&#39;)";  
    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 데이터 구문 분석 기술 요약

기본 JS 캡슐화 페이드 인 및 페이드 아웃 효과 기능 단계에 대한 자세한 설명

vue project_vue.js에서 sass를 사용하는 구성 방법

위 내용은 JavaScript에서 Alert() 메소드를 다시 작성하는 기술 분석에 중점을 둡니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!