Bantuan pembangunan dan modul

mip mempunyai beberapa alatan dan modul pembangunan terbina dalam untuk menyelesaikan beberapa masalah yang dihadapi dalam pembangunan mip dan menyokong JS asli.

Artikel ini mengandungi tiga bahagian:
1. Penggantian jquery dan zepto
2 Bantuan Viewport
3 Pengenalan jquery dan zepto

1 Penggantian jquery dan zepto

tidak disyorkan.

Mengapa tidak disyorkan
1. Native JS cukup mudah untuk digunakan
2 Prestasi jquery dan zepto lebih teruk daripada JS asli
3. & zepto?

Sila lihat bantuan di bawah kebanyakannya boleh digantikan dengan JS asli juga menyediakan beberapa komponen terbina dalam untuk menyelesaikan masalah keserasian. .

kedudukan&wi dth&tinggi

// 全局

// jquery
$('selector');
// native
document.querySelectorAll('selector');

// 局部
var element = document.getElementById('xxx');
// jquery
$('selector', element);
// native
element.querySelectorAll('selector');

// 另外原生也支持
element.getElementsByClassName
element.getElementById
element.getElementsByTagName

ajax

Permintaan tak segerak gunakan ambil dan ambil -jsonp

fetch
fetch-jsonp

// attr
// jquery
$element.attr('test');
$element.attr('test', '123');
// native
element.getAttribute('test');
element.setAttribute('test', '1');
element.hasAttribute('test');

// data
// jquery
$element.data('test');
$element.data('test', '1');
// native
element.dataset['test'];
element.dataset['test'] = '1';

event

var util = require('util');

// previousElement
// jquery
$element.prev();
// native
element.previousElementSibling;

// nextElement
// jquery
$element.next();
// native
element.nextElementSibling;

// closest
// jquery
$element.closest(selector);
// mip
util.dom.closest(element, selector);

// contains
// jquery
jQuery.contains(parent, child);
// mip
util.dom.contains(parent, child);

// matches(判断element与selector是否匹配)
// mip
util.dom.matches(document.body, 'body'); // true

// 其它常规操作
// native
element.appendChild
element.insertBefore
element.removeChild
element.innerHTML
element.textContent

util

// jquery
$element.css('display', 'none');

// mip
var util = require('util');
util.css(element, 'display', 'none');
util.css(element, {
    left: 100,
    top: 200
});
var arr = [element, element1, element2];
util.css(arr, 'display', 'none');

Sistem mudah alih & kernel pelayar & pengeluar penyemak imbas paparan bantuan pertimbangan

// add
// jquery
$element.addClass('test');
// native
element.classList.add('test');

// remove
// jquery
$element.removeClass('test');
// native
element.classList.remove('test');

// has
// jquery
$element.hasClass('test');
// native
element.classList.contains('test');

// toggle
// jquery
$element.toggleClass('test');
// native
element.classList.toggle('test');

view

2. . Perkenalkan jquery atau zepto

Memandangkan jquery dan zepto mempunyai keperluan tertentu. Jadi mip juga menyediakan kaedah pengenalan tak segerak untuk menggunakannya.

Kaedah pengenalan:

// position
// jquery
$element.position();
// native
element.offsetLeft
element.offsetTop

// offset
// jquery
$element.offset();
// mip
var util = require('util');
util.rect.getElementOffset(element);