day01
一、软件按照程序和数据存储位置的不同，可以分为：
单机软件 界面：Tk、pyQt、wxPython
C/S架构软件 界面：Tk、pyQt、wxPython
B/S 架构软件 界面：网页
二、前端开发的定义：为B/S架构软件提供界面解决方案
三、网页的基本结构：看讲义
四、快捷键创建网页：英文的“！”+tab键
五、标签按照显示的效果可以分为：
块元素标签：默认占有一行
内联元素标签：默认可以排列在一行
六、常用html标签：
1、h1~h6: 标题标签，块元素标签，含有默认样式
2、P： 段落标签，块元素标签，含有默认样式
3、字符实体：如果想在网页上显示空格，“<”个“>”, 不能直接在代码中写，需要写成它们的字符实体，空格： 小于号：< 大于号 >
4、div 通用块元素标签，一般做嵌套使用，没有默认样式
5、a 链接标签，属于内联元素标签，通过herf属性设置链接地址，将a标签包裹img标签可以用图片做链接，默认链接地址写成“#”
6、img 图片标签，属于内联元素标签，通过src属性设置图片地址，通过alt设置图片文字说明
7、span 通用内联元素标签，一般用在样式设置中
七、html布局基本步骤：看练习
八、css引入页面的三种方式：
1、内联式：通过标签的style属性，把样式写在标签中
2、内嵌式：通过style标签，把样式写在head标签中
3、外链式：外部创建一个css文件，页面通过link标签引入
九、css三种选择器：
1、标签选择器：写法和标签名相同，会选择所有的标签
2、类选择器：名称任意，名称前需要加“.”，标签通过class属性引用
3、层级选择器：通过层级关系匹配标签
十、css常用样式：学会查看属性样式列表
day02
一、相对地址和绝对地址：
相对地址：“./” 表示当前文件所在目录 “../” 表示当前文件所在目录的上一级目录
绝对地址：做为了解，一般不用
二、列表标签相关：
新闻标题列表、文章标题列表、菜单要使用列表标签
列表创建的快捷键：ul>(li>a{列表文字})*8
多行操作：点击一行，然后按住alt键不放，再点击其他行，就可以选中多行
列表标签样式：list-style:none 去掉小圆点
三、表单，记住常用的标签：form标签 单行文本输入框 密码输入框 提交按钮 普通按钮创建 下拉框
四、三种选择器：
Id选择器： 通过id名称来选择标签
组选择器： 将通过的样式抽取出来写在一起，选择器之间用“，”隔开
伪类选择器： 定义鼠标悬停时标签的样式
五、盒子模型：
padding 的定义方式
margin 的定义方式
盒子的真实尺寸计算
day03
一、设置块元素相对于父级水平居中的技巧：将块元素左右的margin值设置为auto，一般写成：margin:0px auto;
二、元素显示特性display
display:inline 将元素转化为内联元素
display:block 将元素转化为块元素
display:none 将元素隐藏
三、元素溢出样式设置：在父级上设置
overflow:visible 超出的部分显示
overflow:hidden 超出的部分隐藏
overflow:scroll 不管是否超出，都显示滚动条来滚动显示超出的部分
overflow:auto 根据实际情况，动态显示滚动条
四、表格
table表格、tr标签、th和td标签
设置表格边框合并样式：border-collapse:collapse
五、定位
Position：relative 相对定位 相对自己定位，原位置保留
Position：absolute 绝对定位 相对有定位的父级来定位，原位置丢掉
Position：fixed 固定定位 相对浏览器定位，原位置丢掉
设置定位偏移：left right top bottom
设置定位层级： z-index
定位元素水平垂直居中技巧
六、css权重：style的权重是1000， 标签选择器的权重是1，类选择器的权重是10
七、photoshop测量取色，多操作几次
八、前端页面开发流程
1、得到效果图
2、创建项目目录
3、切图
4、新建html文件和css文件
5、参照效果图，编写html和css代码
day04
一、javascript引入页面的三种方式：
1、行间事件： 将javascript代码通过标签的事件属性写在标签中
2、内嵌式：在head标签中插入script标签，然后在script标签中写JavaScript代码
3、外链式：将JavaScript代码写在一个js文件中，html文件中通过script标签来引入这个js文件
二、javascipt数据类型：
1、5种基本数据类型：number、string、boolean、undefined、null
2、1种复合类型：object
三、变量及关键字的命名规则：
1、区分大小写
2、第一个字符可以是字母、下划线或者$
3、其他字符可以是字母、数字、下划线、或者$
四、函数相关：
1、函数定义 用function 关键字
2、函数的预解析 函数可以先调用，再定义
五、条件语句
1、双等和三等的区别
2、&& || ！的写法
3、多重if else语句写法和python的区别
六、获取元素方法
document.getElementById(‘id名称’)
七、操作元素属性
1、html的属性和js里面属性写法一样
2、“class” 属性写成 “className”
3、“style” 属性里面的属性，有横杠的改成驼峰式
4、innerHTML 操作元素内包裹的内容
八、事件属性和匿名函数
oDiv.onclick = function(){ ...... }
day05
一、函数传参
形参 实参
点击按钮调用带参数的函数： oBtn.onclick = function(){ fnChange(‘red’,’30px’) }
二、return关键字的作用
1、返回函数中的变量或者对象
2、在return这一句结束函数的运行
三、数组操作：
1、创建数组：面向对象的方式：var aList = new Array(1,2,3) 直接量方式：var aList2 = [‘a’,’b’]
2、获取数组成员的个数：length属性
3、操作数组的某个成员：下标
4、在数组后面增加或者删除成员：push() 方法 pop() 方法
5、将数组反转：reverse() 方法
6、获取某个成员在数组中第一次出现的索引值：indexOf() 方法
7、在数组中增加或者删除成员：splice() 方法
8、将数组拼接成字符串：join() 方法
四、循环语句 for(var i=0;i<iLen;i++){ 循环体 }
五、字符串操作方法：
1、”+” 符号两边是数字，就做加法，如果有一边是字符串，就做字符串拼接
2、parseInt() 将整数字符串转化为整数，如果是小数会去掉小数位
3、parseFloat() 将小数的字符串转化为小数
4、split() 将字符串转化为数组
5、indexOf() 获取某小段字符串在大段字符串里面的索引值 如果不存在就返回-1
6、substring() 截取字符串
六、定时器
只执行一次的定时器：var oTimer1 = setTimeout(函数名，间隔时间) 间隔时间单位为毫秒，不用写单位
关闭只执行一次的定时器：clearTimeout(oTimer1)
反复执行的定时器：var oTimer2 = setInterval(函数名，间隔时间)
关闭反复执行一次的定时器：clearInterval(oTimer2)
day06
一、javascript调试程序的方法：
1、将变量或对象打印出来：alert(‘变量’) console.log(‘变量’) document.title = ‘变量’
2、断点调试：将js代码独立成一个js文件，然后在chrome浏览器的source窗口中打断点调试
二、变量作用域：
1、定义变量要加“var”
2、在函数内部定义局部变量要加“var”
3、在函数内部可以直接修改全局变量
4、在函数内部如果不加var来定义变量，那么这个变量是全局变量
5、全局变量为整个页面共享，一个地方改变，其他地方都改变
三、封闭函数
三种写法：
;(function(){ ...... })( );
;!function(){ ...... }( );
;~function(){ ...... }( );
四、jquery文档加载完再执行：$(function(){ ...... })
五、jquery选择器及选择集过滤和转移，看讲义
六、jquery操作样式
1、操作行间样式： 读取：$div.css(‘width’) 写入：$div.css({‘width’:100,’height:’100’})
2、操作样式类名： 增加样式类名 addClass(‘类名’) 删除样式类名：removeClass(‘类名’)
day07
一、检查jquery是否选择了元素：用jquery对象的length属性
二、动画方法animate() 的参数
参数一：要改变的样式属性，写成字典的形式
参数二：动画持续的时间，单位是毫秒，默认是400毫秒，定义时不写单位
参数三：动画曲线，有 swing 缓冲运动 linear 匀速运动
参数四：回调函数
三、jquery特性动画效果方法：
1、show()
2、hide()
3、toggle()
4、fadeIn()
5、fadeOut()
6、fadeToggle()
7、slideUp()
8、slideDown()
9、slideToggle()
四、jquery链式调用：对象操作方法完成后转移，接着操作方法，可以写成一串的形式
五、属性操作
1、操作元素除样式属性之外的其他属性：prop() 方法，操作value属性的方法封装成了val()方法
2、操作元素内部包裹的内容：html() 方法
六、常用表单事件
1、blur 输入框失去焦点事件
2、submit 点击submit按钮，form标签发生提交事件 submit
七、正则表达式使用
定义方式：1、面向对象定义 2、直接量： var reTest = /’规则’/
使用方法：正则规则.test( 字符串 ) 返回布尔值
day08
一、常用事件：
1、focus事件 获取焦点事件，一般不在这个事件上绑定函数，一般作为让输入框自动或的焦点的方式使用，写法：$input.focus( )
2、mouseover 和 mouseout 鼠标移入移出事件 移入子元素也会触发
3、mouseenter 和 mouseleave 鼠标移入移出事件 移入子元素不会触发
4、hover 可以将mouseenter 和 mouseleave事件合并在一起写，写法：
$input.hover(function(){ mouseenter的操作 },function(){ mouseleave的操作 })
二、事件冒泡
原理：元素发生事件后，会将这个事件传递父级，父级还会往上传递，一直传递到最顶级标签，一般最顶级标签写成$(document)
阻止事件冒泡：return false
三、事件委托
原理：利用事件冒泡的特性，将事件绑定在父级上，子集发生的事件都会冒泡到父级，父级通过判断子级的特征给它特定的操作。
写法： $ul.delegate(‘li’, ‘click’, function(){ 这里的$(this)指的是当前冒泡的子级 })
四、Dom操作（也叫作节点操作）
1、append 和 appendTo
2、prepend 和 prependTo
3、after 和 inserAfter
4、before 和 insertBefore
5、remove 删除节点
一、软件按照程序和数据存储位置的不同，可以分为：
单机软件 界面：Tk、pyQt、wxPython
C/S架构软件 界面：Tk、pyQt、wxPython
B/S 架构软件 界面：网页
二、前端开发的定义：为B/S架构软件提供界面解决方案
三、网页的基本结构：看讲义
四、快捷键创建网页：英文的“！”+tab键
五、标签按照显示的效果可以分为：
块元素标签：默认占有一行
内联元素标签：默认可以排列在一行
六、常用html标签：
1、h1~h6: 标题标签，块元素标签，含有默认样式
2、P： 段落标签，块元素标签，含有默认样式
3、字符实体：如果想在网页上显示空格，“<”个“>”, 不能直接在代码中写，需要写成它们的字符实体，空格： 小于号：< 大于号 >
4、div 通用块元素标签，一般做嵌套使用，没有默认样式
5、a 链接标签，属于内联元素标签，通过herf属性设置链接地址，将a标签包裹img标签可以用图片做链接，默认链接地址写成“#”
6、img 图片标签，属于内联元素标签，通过src属性设置图片地址，通过alt设置图片文字说明
7、span 通用内联元素标签，一般用在样式设置中
七、html布局基本步骤：看练习
八、css引入页面的三种方式：
1、内联式：通过标签的style属性，把样式写在标签中
2、内嵌式：通过style标签，把样式写在head标签中
3、外链式：外部创建一个css文件，页面通过link标签引入
九、css三种选择器：
1、标签选择器：写法和标签名相同，会选择所有的标签
2、类选择器：名称任意，名称前需要加“.”，标签通过class属性引用
3、层级选择器：通过层级关系匹配标签
十、css常用样式：学会查看属性样式列表
day02
一、相对地址和绝对地址：
相对地址：“./” 表示当前文件所在目录 “../” 表示当前文件所在目录的上一级目录
绝对地址：做为了解，一般不用
二、列表标签相关：
新闻标题列表、文章标题列表、菜单要使用列表标签
列表创建的快捷键：ul>(li>a{列表文字})*8
多行操作：点击一行，然后按住alt键不放，再点击其他行，就可以选中多行
列表标签样式：list-style:none 去掉小圆点
三、表单，记住常用的标签：form标签 单行文本输入框 密码输入框 提交按钮 普通按钮创建 下拉框
四、三种选择器：
Id选择器： 通过id名称来选择标签
组选择器： 将通过的样式抽取出来写在一起，选择器之间用“，”隔开
伪类选择器： 定义鼠标悬停时标签的样式
五、盒子模型：
padding 的定义方式
margin 的定义方式
盒子的真实尺寸计算
day03
一、设置块元素相对于父级水平居中的技巧：将块元素左右的margin值设置为auto，一般写成：margin:0px auto;
二、元素显示特性display
display:inline 将元素转化为内联元素
display:block 将元素转化为块元素
display:none 将元素隐藏
三、元素溢出样式设置：在父级上设置
overflow:visible 超出的部分显示
overflow:hidden 超出的部分隐藏
overflow:scroll 不管是否超出，都显示滚动条来滚动显示超出的部分
overflow:auto 根据实际情况，动态显示滚动条
四、表格
table表格、tr标签、th和td标签
设置表格边框合并样式：border-collapse:collapse
五、定位
Position：relative 相对定位 相对自己定位，原位置保留
Position：absolute 绝对定位 相对有定位的父级来定位，原位置丢掉
Position：fixed 固定定位 相对浏览器定位，原位置丢掉
设置定位偏移：left right top bottom
设置定位层级： z-index
定位元素水平垂直居中技巧
六、css权重：style的权重是1000， 标签选择器的权重是1，类选择器的权重是10
七、photoshop测量取色，多操作几次
八、前端页面开发流程
1、得到效果图
2、创建项目目录
3、切图
4、新建html文件和css文件
5、参照效果图，编写html和css代码
day04
一、javascript引入页面的三种方式：
1、行间事件： 将javascript代码通过标签的事件属性写在标签中
2、内嵌式：在head标签中插入script标签，然后在script标签中写JavaScript代码
3、外链式：将JavaScript代码写在一个js文件中，html文件中通过script标签来引入这个js文件
二、javascipt数据类型：
1、5种基本数据类型：number、string、boolean、undefined、null
2、1种复合类型：object
三、变量及关键字的命名规则：
1、区分大小写
2、第一个字符可以是字母、下划线或者$
3、其他字符可以是字母、数字、下划线、或者$
四、函数相关：
1、函数定义 用function 关键字
2、函数的预解析 函数可以先调用，再定义
五、条件语句
1、双等和三等的区别
2、&& || ！的写法
3、多重if else语句写法和python的区别
六、获取元素方法
document.getElementById(‘id名称’)
七、操作元素属性
1、html的属性和js里面属性写法一样
2、“class” 属性写成 “className”
3、“style” 属性里面的属性，有横杠的改成驼峰式
4、innerHTML 操作元素内包裹的内容
八、事件属性和匿名函数
oDiv.onclick = function(){ ...... }
day05
一、函数传参
形参 实参
点击按钮调用带参数的函数： oBtn.onclick = function(){ fnChange(‘red’,’30px’) }
二、return关键字的作用
1、返回函数中的变量或者对象
2、在return这一句结束函数的运行
三、数组操作：
1、创建数组：面向对象的方式：var aList = new Array(1,2,3) 直接量方式：var aList2 = [‘a’,’b’]
2、获取数组成员的个数：length属性
3、操作数组的某个成员：下标
4、在数组后面增加或者删除成员：push() 方法 pop() 方法
5、将数组反转：reverse() 方法
6、获取某个成员在数组中第一次出现的索引值：indexOf() 方法
7、在数组中增加或者删除成员：splice() 方法
8、将数组拼接成字符串：join() 方法
四、循环语句 for(var i=0;i<iLen;i++){ 循环体 }
五、字符串操作方法：
1、”+” 符号两边是数字，就做加法，如果有一边是字符串，就做字符串拼接
2、parseInt() 将整数字符串转化为整数，如果是小数会去掉小数位
3、parseFloat() 将小数的字符串转化为小数
4、split() 将字符串转化为数组
5、indexOf() 获取某小段字符串在大段字符串里面的索引值 如果不存在就返回-1
6、substring() 截取字符串
六、定时器
只执行一次的定时器：var oTimer1 = setTimeout(函数名，间隔时间) 间隔时间单位为毫秒，不用写单位
关闭只执行一次的定时器：clearTimeout(oTimer1)
反复执行的定时器：var oTimer2 = setInterval(函数名，间隔时间)
关闭反复执行一次的定时器：clearInterval(oTimer2)
day06
一、javascript调试程序的方法：
1、将变量或对象打印出来：alert(‘变量’) console.log(‘变量’) document.title = ‘变量’
2、断点调试：将js代码独立成一个js文件，然后在chrome浏览器的source窗口中打断点调试
二、变量作用域：
1、定义变量要加“var”
2、在函数内部定义局部变量要加“var”
3、在函数内部可以直接修改全局变量
4、在函数内部如果不加var来定义变量，那么这个变量是全局变量
5、全局变量为整个页面共享，一个地方改变，其他地方都改变
三、封闭函数
三种写法：
;(function(){ ...... })( );
;!function(){ ...... }( );
;~function(){ ...... }( );
四、jquery文档加载完再执行：$(function(){ ...... })
五、jquery选择器及选择集过滤和转移，看讲义
六、jquery操作样式
1、操作行间样式： 读取：$div.css(‘width’) 写入：$div.css({‘width’:100,’height:’100’})
2、操作样式类名： 增加样式类名 addClass(‘类名’) 删除样式类名：removeClass(‘类名’)
day07
一、检查jquery是否选择了元素：用jquery对象的length属性
二、动画方法animate() 的参数
参数一：要改变的样式属性，写成字典的形式
参数二：动画持续的时间，单位是毫秒，默认是400毫秒，定义时不写单位
参数三：动画曲线，有 swing 缓冲运动 linear 匀速运动
参数四：回调函数
三、jquery特性动画效果方法：
1、show()
2、hide()
3、toggle()
4、fadeIn()
5、fadeOut()
6、fadeToggle()
7、slideUp()
8、slideDown()
9、slideToggle()
四、jquery链式调用：对象操作方法完成后转移，接着操作方法，可以写成一串的形式
五、属性操作
1、操作元素除样式属性之外的其他属性：prop() 方法，操作value属性的方法封装成了val()方法
2、操作元素内部包裹的内容：html() 方法
六、常用表单事件
1、blur 输入框失去焦点事件
2、submit 点击submit按钮，form标签发生提交事件 submit
七、正则表达式使用
定义方式：1、面向对象定义 2、直接量： var reTest = /’规则’/
使用方法：正则规则.test( 字符串 ) 返回布尔值
day08
一、常用事件：
1、focus事件 获取焦点事件，一般不在这个事件上绑定函数，一般作为让输入框自动或的焦点的方式使用，写法：$input.focus( )
2、mouseover 和 mouseout 鼠标移入移出事件 移入子元素也会触发
3、mouseenter 和 mouseleave 鼠标移入移出事件 移入子元素不会触发
4、hover 可以将mouseenter 和 mouseleave事件合并在一起写，写法：
$input.hover(function(){ mouseenter的操作 },function(){ mouseleave的操作 })
二、事件冒泡
原理：元素发生事件后，会将这个事件传递父级，父级还会往上传递，一直传递到最顶级标签，一般最顶级标签写成$(document)
阻止事件冒泡：return false
三、事件委托
原理：利用事件冒泡的特性，将事件绑定在父级上，子集发生的事件都会冒泡到父级，父级通过判断子级的特征给它特定的操作。
写法： $ul.delegate(‘li’, ‘click’, function(){ 这里的$(this)指的是当前冒泡的子级 })
四、Dom操作（也叫作节点操作）
1、append 和 appendTo
2、prepend 和 prependTo
3、after 和 inserAfter
4、before 和 insertBefore
5、remove 删除节点