تصف هذه المقالة كيف ينفذ JS زرًا. شاركه للرجوع إليه. طريقة التنفيذ المحددة هي كما يلي:
<! doctype html> <html> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua-contency content =" edge "> <script> 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 () {fireevent (btn ، 'show') ؛ }} الدالة btn () {this.btn = null ؛ this.settings = {width: 200 ، الارتفاع: 40 ، الحدود: 6 ، نص: 'button'} ؛ } 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 att in OBJ2) {obj1 [attr] = obj2 [attr] ؛ }} وظيفة bindEvent (OBJ ، الأحداث ، fn) {obj.listeners = obj.listeners || {} ؛ OBJ.Listeners [الأحداث] = OBJ.Listeners [الأحداث] || [] ؛ OBJ.Listeners [الأحداث] .push (FN) ؛ if (obj.nodeType) {if (obj.addeventListener) {obj.addeventListener (events ، fn ، false) ؛ } آخر {obj.attachevent ('on'+events ، fn) ؛ }}} fireeVENST (OBJ ، الأحداث) {if (obj.listeners [events]) {for (var i in obj.listeners [events]) {obj.listeners [events] [i] () ؛ }}} </script> </head> <body> <a id = "btn" style = "margin-top: 40px ؛" > 12 </a> </body> </html>آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.