whqet

```javascript /* 1.事件流 2.事件处理 html事件处理 HTML元素的事件属性绑定事件处理函数 DOM0级事件处理 DOM2级事件处理 最为流行、最为支持的方式 IE9-不支持 shim polyfill shim 让新的浏览器和旧的浏览器都支持新特性，例如定义一个新的绑定事件的方式 bindEvent（根据不同浏览器做适配） polyfill 让旧的浏览器支持新浏览器特性，例如让IE9-可以使用addEventListener IE事件处理 * */ //html属性直接调用 function chgBackground () { document.getElementById("b").style.backgroundColor="#f00"; } //dom0级 var oBtn2=document.getElementById("btn2");...

## 样式编辑器 ```html Document :root{ --bgC:#f00; --fontSize:12px; --color:#fff; } body{ background-color: var(--bgC); font-size: var(--fontSize); transition:background-color 1s; } p{ color: var(--color); font-size: 1.5em; transition:font-size .2s; } .k{ width: 100px; height: 100px;...

[非常不错的逐行新闻滚动效果](https://bestace.github.io/fed/ppt/demos/jsBOM/news.html)

JS 计时器的使用 #327

上课的时候用到的package.json ```javascript { "name": "web", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "babel-cli":...

上课时用到的gulpfile.js ```javascript const gulp = require('gulp'); const uglify = require('gulp-uglify'); const babel = require('gulp-babel'); const pump = require('pump'); gulp.task('default',function(){ console.log('ok'); }) gulp.task('compress', function (cb) { pump([ gulp.src('js/*.js'), babel({ "presets": ["env"]...

首先贴出 上课所用案例。 00 王海庆 [细线表格](//zptcweb.github.io/table/table1.html) 00 王海庆 [斑马纹表格](//zptcweb.github.io/table/table2.html) 00 王海庆 [渐变背景表格](//zptcweb.github.io/table/table3.html) 00 王海庆 [横线表格](//zptcweb.github.io/table/table4.html) 00 王海庆 [带滚动条的表格](//zptcweb.github.io/table/table5.html) --------------------------------------------------------------------- 分隔线之后是我的收集。 00 王海庆 [其他行模糊的表格](http://codepen.io/whqet/full/YVYrNP/) 00 王海庆 [可编辑的表格，需要JS](http://codepen.io/ashblue/pen/mCtuA) 00 王海庆 [响应式表格](http://codepen.io/whqet/pen/WjdZRE) 00 王海庆...

> 推荐一个很好用的属性:display:flex; @FullOfVigour 感谢师兄的参与，flexbox确认是一个强大的属性。

@wabxq 分享知识点很好很棒！！ 如果能够层次更分明写、条理更清晰些就更棒了！！

一个非常重要的分割线