New work（）

4月開始接盤，前人挖坑後人種樹系列

目前使用了：

• layui
  
• jquery-weui
  
• WeUi
  
• Echarts.js
  
• swiper.js
  
• fastclick.js
  
• video.js
• bootstrap
• easyui
  
  

模板引擎文檔 - layui.laytpl----標準實例參考：

//假設你獲得了這麼一段數據
var data = {
  title: '前端圈',
  intro: '一羣碼js的騷年，幻想改變世界，卻被世界改變。',
  list: [
          {name: 'bob', city: '杭州'},  {name: 'peter', city: '北京'}, 
          {name: 'faker', city: '杭州'}, {name: 'joking', city: '北京'}
        ]
};

var tpl = document.getElementById('tpl').innerHTML; //讀取模版
//方式一：異步渲染（推薦）
laytpl(tpl).render(data, function(render){
  document.getElementById('view').innerHTML = render;
});

//方式二：同步渲染：
var render = laytpl(tpl).render(data);
document.getElementById('view').innerHTML = render;複製代碼

<h3>{{ d.title }}</h3>
<p class="intro">{{ d.intro }}</p>
<ul>
{{# for(var i = 0, len = d.list.length; i < len; i++){ }}
  <li>
    <span>{{ d.list[i].name }}</span>
    <span>所在城市：{{ d.list[i].city }}</span>
  </li>
{{# } }}
</ul>複製代碼

https://www.layui.com/複製代碼

location.search

search 屬性是一個可讀可寫的字符串，可設置或返回當前 URL 的查詢部分
（問號 ? 以後的部分）

FastClick

處理移動端 click 事件 300 毫秒延遲， 由 FT Labs 開發，

Github 項目地址：github.com/ftlabs/fast… 。

爲何存在延遲？

根據 Google 開發者文檔：

...mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually performing a double tap.

從點擊屏幕上的元素到觸發元素的 click 事件，移動瀏覽器會有大約 300 毫秒的等待時間。爲何這麼設計呢？ 由於它想看看你是否是要進行雙擊（double tap）操做。

兼容性

• Mobile Safari on iOS 3 and upwards
• Chrome on iOS 5 and upwards
• Chrome on Android (ICS)
• Opera Mobile 11.5 and upwards
• Android Browser since Android 2
• PlayBook OS 1 and upwards

不該用 FastClick 的場景

• 桌面瀏覽器；
• 若是 viewport meta 標籤 中設置了 width=device-width， Android 上的 Chrome 32+ 會禁用 300ms 延時；

<meta name="viewport" content="width=device-width, initial-scale=1">
複製代碼

• viewport meta 標籤若是設置了 user-scalable=no，Android 上的 Chrome（全部版本）都會禁用 300ms 延遲。
• IE10 中，能夠使用 css 屬性 -ms-touch-action: none 禁止元素雙擊縮放（參考文章）。

使用方法

TODO: 修改使用接口

window.addEventListener('load', function() {
  FastClick.attach(document.body);
}, false);複製代碼

$(function() {
  FastClick.attach(document.body);
});複製代碼

var attachFastClick = require('fastclick');
attachFastClick(document.body);複製代碼