demo进一步优化,这是今天学到的。
一、YP框架
1、YP框架格式
二、书写格式
1、个人签名的标准格式(css和js)
2、命名
CSS:body-bg
JS:下划body_bg
三、弹窗思路
1、三种方法
mousedown()按下鼠标
mousemove()移动鼠标
mouseup()松开鼠标
2、节点应移动的距离 = 节点初始位置 – 鼠标初始位置 + 鼠标移动的位置
四、新的学习
1、JS用单引号
原因:便于引用HTML
2、新接触的快捷键功能
(1)全部缩进只要全选起来,按Tab即可
(2)取消缩进: Shift + Tab
(3)注释: Ctrl + /
3、width()、height()、innerWidth()、innerHeight()、outerWidth()、outerHeight()用法和区别
用content、padding、border、margin来解释
width()、height():content
innerWidth()、innerHeight():content+padding
outerWidth()、outerHeight():content+padding+border
4、pageXpageYoffsetLeftoffsetTop
event.pageX、event.pageY:距离文档边缘鼠标的位置
offsetLeft、offsetTop:相对于父级对象的布局
5、jQuery1.7开始引入全新的事件绑定机制on()、off()
它们替换了bind(), live(), delegate()
多个事件、多个函数
6、命名要更有语义化,特别是做大项目的时候
7、绑定事件的命名空间
mousemove.model
说明:mousemove是事件类型,model是命名空间。
作用:用off()即可解除绑定在model命名空间的事件,不会解除其他命名空间所绑定的相同事件。
8、jquery调用要在bootstrap组件前,
9、将jquery对象先缓存起来,缓存到一个全局变量中。(优化)
举例:
var ui = {};
ui.$pop_form = $(‘.pop-form’);
ui.$pop_text = ui.$pop_form.find(‘input’);
ui.$pop_submit = ui.$pop_form.find(‘button’);