使用FileReader实现前端图片预览

<input type="file"><br>

<img src="" height="200" alt="Image preview area..." title="preview-img">

var fileInput = document.querySelector('input[type=file]');

var previewImg = document.querySelector('img');

fileInput.addEventListener('change', function () {

   var file = this.files[0];

   var reader = new FileReader();

   reader.addEventListener('load', function () {

       previewImg.src = reader.result;

   }, false);

   reader.readAsDataURL(file);

}, false);

取到页面中所有的checkbox怎么做？(不使用第三方框架)

var doc = document,

   domList = doc.getElementsByTagName('input'),

   checkBoxList = [],

   len = domList.length;

while (len--) {

   if (domList[len].type === 'checkbox') {

       checkBoxList.push(domList[len]);

   }

}

JavaScript模版引擎小实例

<div class="result"></div>

<script type="template" id="template">

   <h2>

       <a href="{{href}}">

           {{title}}

       </a>

   </h2>

   <img src="{{imgSrc}}" width="300" height="100" alt="{{title}}"/>

</script>

数据

var data = [

   {

       title: "",

       href: "",

       imgSrc: ""

   },

   ...

];

方法一：

var doc = document,

   template = doc.querySelector('#template').innerHTML,

   result = doc.querySelector('.result'),

   fragment = '';