web高效前端编程读写笔记

1.css相关

• .a，.b｛逗号指a和b相同的css样式｝
• .a .b｛空格指后代元素｝；
• .a>.b｛大于号指子代元素｝；
• .a+.b｛这个“+”是选择相邻兄弟，叫做“相邻兄弟选择器”}
• .a~.b｛这个“~”是选择器 a之后出现的所有b}
• 更多css选择指南

2.实现redio/checkbox自定义

3.Form表单提交的用途

• 1.提交表单会以action的参数为url提交AJAX请求method参数可以设置请求方式，并重定向
• 2.form内的input点击回车按钮时会触发表单提交

4.IE下的Input

• 在IE下input type不认识的情况下会强制转化为text 例如 type="email"会转化为 type="text"
  这时候 inpte[type=email]样式会失效

---

5.伪元素

1.常用伪元素，不会影响查DOM的效率，不是实际的HTML标签，可以加快浏览器加载，对SEO也有帮助
2.img/input等单标签没伪元素

6.JS性能优化

1.JS/CSS/HTML 解耦 （通过class来控制样式）
2.减少重复代码，相同功能的js可封装成公用函数
3.不要滥用闭包，访问闭包内的变量会加成查找时间
消耗性能的写法（访问factor的时间比访问count的时间长）

function getResult(count) {
  count++;
  function process() {
      var factor = 2;
      return count * factor - 5;
  }
  return process();
}

好的写法（这样访问factor的时间和访问count的时间一样）

function getResult(count) {
  count++;
  function process() {
      var factor = 2;
      return count * factor - 5;
  }
  return process(count);
}

4.不要滥用全局变量，全局作用域比较复杂，查找属性较慢
5.不要频繁的访问全局变量，可以赋值给本作用域变量
6.==和的===差异

null == undefined                              // true
''== '0'                                       // false
0 == ''                                        // true
0 == '0'                                       // true
' \t\r\n ' == 0                                // true
new String("abc") == 'abc'                     // true
new Boolean(true) ==true                       // true
true ==1                                       // true

7.减少http请求，如果css样式较少的时候，可以写成内联样式，减少http请求
8.http1.1同时请求条数有限制，过多请求占用资源

7.CSS优化

1.做动画时能用transform就不要用position/width/height减少layout的影响范围。
2.简化DOM结构，特别是需要做动画的，flex布局做动画更流畅，比float有优势。
3.减少base64图片存放，3k的图片转成base64，体积将变成4k，用base64图片又能减少http请求，所以要把握好度。

macdown 常用笔记

• 代码段

CGFloat height = 100;
CGFloat width = 100;
UIView *myView = [[UIView alloc]init;

• 表格
  |:--|:--:|---:|(居左 居中 居右)

s	ss	ss
dsa	dsa	sad

|s|ss|ss|
|:--|:--:|--:| 
|dsa|dsa|sad|

• 高亮

高亮

>高亮

• 上面
  我在下面^我在上面

我在下面我在上面

• 标红
  dsadsadasdsa

`dsadsadasdsa`

• 斜体

*text*

• 加粗
  text

**text**

• 分割线

---

---