В этой статье описывается, как JS реализует кнопку. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
<! Doctype html> <html> <head> <meta charset = "utf-8"> <meta http-equiv = "x-ua-совместимый" 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 betn = document.getElementbyid ('btn'); optn.onclick = function () {FireVent (btn, 'show'); }} функция btn () {this.btn = null; this.Settings = {ширина: 200, высота: 40, BorderRadius: 6, Text: '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'; } функция extend (obj1, obj2) {for (var attr in obj2) {obj1 [attr] = obj2 [attr]; }} функция BindEvent (obj, Events, fn) {obj.listeners = obj.listeners || {}; obj.listeners [Events] = obj.listeners [Events] || []; obj.listeners [события] .push (fn); if (obj.nodeType) {if (obj.addeventListener) {obj.addeventListener (Events, fn, false); } else {obj.attachevent ('on'+events, fn); }}} function firevent (obj, events) {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.