Artikel ini menjelaskan bagaimana JS mengimplementasikan tombol. Bagikan untuk referensi Anda. Metode implementasi spesifik adalah sebagai berikut:
<! Doctype html> <html> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua-kompatibel" konten = "edge"> <script> window.onload = function () {var btn = btn baru (); btn.init ({lebar: 300}); BindEvent (btn, 'show', function () {alert (1);}) bindevent (btn, 'click', function () {alert (2);}) var obtn = document.getElementById ('btn'); obtn.onClick = function () {fireEvent (btn, 'show'); }} fungsi btn () {this.btn = null; this.settings = {width: 200, tinggi: 40, borderradius: 6, teks: 'tombol'}; } Btn.prototype.init = function (opt) {extand (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'; } function extend (obj1, obj2) {for (var attr dalam obj2) {obj1 [attr] = obj2 [attr]; }} fungsi bindevent (obj, peristiwa, fn) {obj.listeners = obj.listeners || {}; obj.listeners [peristiwa] = obj.listeners [peristiwa] || []; obj.listeners [peristiwa] .push (fn); if (obj.nodetype) {if (obj.addeventListener) {obj.addeventListener (peristiwa, fn, false); } else {obj.attachevent ('on'+events, fn); }}} Fungsi fireevent (obj, peristiwa) {if (obj.listeners [peristiwa]) {for (var i di obj.listeners [peristiwa]) {obj.listeners [peristiwa] [i] (); }}} </script> </head> <tody> <a id = "btn" style = "margin-top: 40px;" > 12 </a> </body> </html>Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.