이 기사에서는 JS가 버튼을 구현하는 방법에 대해 설명합니다. 참조를 위해 공유하십시오. 특정 구현 방법은 다음과 같습니다.
<! docType html> <html> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua-catsible"content = "edge"> <cript> window.onload = function () {var btn = new btn (); btn.init ({width : 300}); bindevent (btn, 'show', function () {alert (1);}) bindevent (btn, 'click', function () {alert (2);}) var obtn = document.getElementById ( 'btn'); obtn.onclick = function () {fireeevent (btn, 'show'); }} 함수 btn () {this.btn = null; this.settings = {너비 : 200, 높이 : 40, BorderRadius : 6, 텍스트 : '버튼'}; } btn.prototype.init = function (opt) {extend (this.settings, opt); this.creat (); } btn.prototype.creat = function () {this.btn = document.createElement ( 'div'); document.body.appendchild (this.btn); this.btn.innerhtml = this.settings.text; this.setData (); } btn.prototype.destory = function () {document.body.removechild (this.btn); } btn.prototype.setdata = function () {this.btn.style.width = this.settings.width +'px'; this.btn.style.height = this.settings.height +'px'; this.btn.style.border = 'solid #f00' + this.settings.borderradius + 'px'; } 함수 확장 (obj1, obj2) {for (var at obj2) {obj1 [attr] = obj2 [attr]; }} 함수 bindevent (obj, events, fn) {obj.listeners = obj.listeners || {}; obj.listeners [Events] = obj.listeners [Events] || []; obj.listeners [events] .push (fn); if (obj.nodetype) {if (obj.addeventListener) {obj.adeventListener (Events, FN, False); } else {obj.attachevent ( 'on'+events, fn); }}} 함수 fireevent (obj, events) {if (obj.listeners [events]) {for (var i in obj.listeners [events]) {obj.listeners [events] [i] (); }}}} </script> </head> <body> <aid = "btn"style = "margin-top : 40px;" > 12 </a> </body> </html>이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.