一个仿jquery简单js库的写法

  • 2020 年 2 月 18 日
  • 筆記

定义类库

 (function (window) {        'use strict'        function defineBayside() {          var Bayside = {};          Bayside.alert = function () {            alert('this is a test messsage from the Bayside framework');          }            return Bayside;        }            if (typeof (Bayside) === 'undefined') {          window.Bayside = defineBayside();        }          })(window);

调用类库

 Bayside.alert();

另一种列子 定义类库

function $(selector) {    const self = {      element: document.querySelector(selector),      html: function () {        return self.element      },      on: function (event, callback) {        document.addEventListener(event, callback)      },      hide: function () {        self.element.style.display = "none"      },      attr: function (name, value) {        if (value == null) {          return self.element.getAttribute(name)        } else {          self.element.setAttribute(name, value)        }      }      }      return self;  }

调用类库

$('h3').on('click', function () {    alert('clicked');    $('h2').hide();    $('h1').attr('class', 'hello')  })