前段技术加html+css+JS
html:负责页面的结构（语义） 网页制作语言（不是编程语言）
css：负责页面的美化（样式） js：增加交互或特效
HTML基本知识点：
HTML含义:html超文本标记语言，通过标签进行语义化描述。“超文本”就是指页面内可以包含图片、链接、甚至音乐、程序等非文字元素 。“标记”的主要含义不是从外观角度考虑，而是从语义的角度。
1.<h1~h6> 主要给文字赋予标题的含义 容器级标签
2.<p> 段落标签 文本级标签
3.超链接a <a href="链接资源的地址" target=_blank"></a> " target=_blank"在新窗口打开
4.<img src="图片路径" title=“” alt=”“>
5.表单：收集用户输入的信息
*文本框：input type="text"
*密码框：input type="password"
laber 标签
<laber for="txt">文字</laber>
<input type="text"/> //让label标签的文字和当前表单产生关联
radio 单选 checkbox多选
图片按钮：<input type="image" src="">
6.<caption>定义网页标题
7.<maequee>跑马灯标签
8.<div>块级标签 容量级标签
9.<span>行内标签
10.有序列表：
<ol>
<li></li>
<li></li>
</ol>
无序列表：
<ul>
<li></li>
<li></li>
</ul>
11.表格 <table> <tr> <td>;
CSS基本知识点:
1.width：宽度； height：高度；
2.padding：外边距； margin：外边距； border：边框；
3.solid 实现 dashed 虚线 dotted 圆点虚线 double 双实线 ridge 具有3D立体效果的边框
4.padding属性的写法：
padding-top:上内边距；
padding-right：右内边距；
padding-bottom:下内边距；
padding-left:左内边距；
5.做网页时，需清楚默认样式 *{padding：0； margin：0；}
6.border三要素：细线、颜色、线型（形状） 透明度：transparent；
7.！imporant 给最高权重；
8.text-align:center; 文本居中；
9.display：inline； 块元素转为行内元素 display:block; 行内元素转为块元素；
10.css中三种方式可以让元素脱离标准文档流：浮动、绝对定位、固定定位；
11.clear：both； overflow：hidden；清除浮动
12.list-style-type:none; 清除列表的小圆点；
13.background属性：
background-img：url（）设置背景图片；
background-color 背景颜色；
background-size: 放大/缩小倍数，用%表示；
background-position:center top； 图片居中
background-repeat:no-repeat; 图片不平铺；repeat-x; 表示水平方向重复； repeat-y;表示垂直方向重复；
background-attachment 背景是否被固定；
14.<link href="这里是css文件引用路径" type="text/css" rel="stylesheet"/>
15.<style>这里是css样式编辑区域</style>
16.css链接：
a:link 普通的、未被访问的链接；
a:visited 用户已访问的链接；
a:hover 鼠标指针位于链接的上方；
a:active 链接被点击的时刻
a的样式涵盖了:a:link,a:visited的样式；
17.line-height 行高；
18.font属性：能够让字号、字体、行高一起设置；
font-size：字体大小设置；
font-family:字体；
font-weight:bold; 字体加粗；
19.文本装饰：
text-decoration:overline；上划线；
text-decoration:underline; 下划线；
text-decoration:line-through; 删除线；
text-decoration：none；去掉下划线；
19.rgba（0,0,0,0.8）；a表示透明度；
20.position：relative；相对定位 用于元素微调；
position：absolute；绝对定位； 更灵活
position：fixed；固定定位；
position：static； 静态定位；
21.border-radius:10px; 圆角 opacity：0.5；透明度；
22.margin：auto； 标准流中；
23.z-index; 表示谁压着谁，数值大的压着数值小的；
24.text-indent: 文字缩进；
25.box-shadow:10px 10px 5px black；边框外阴影；
box-shadow:insit 10px 10px 5px black；边框内阴影；
26.text-shadow: 文字阴影；
27.overflow：hidden； text-overflow：ellipsis； white-space:nowrap; 多余文字的省略；
28.浏览器的兼容：
-webkie- 谷歌兼容 -moz- 火狐兼容 -ms- IE兼容 -o- 欧朋兼容；
29.css3 2D转换transform；
transform：scale（1.2）ratote（360deg）；scale 放大倍数 ratote 旋转度数；
transition：all 0.2s ease； 达到渐入渐出的效果；
30.resize：none； 文本域固定；
31.outline：none；边框不变；
32.元素的显示或隐藏：
display：none；隐藏 元素所占空间的释放；
display：block；显示；
visibility:hidden；让多余的内容隐藏；
visibility：visible；显示；
33.vertical-align：middle；垂直居中
34.行内式>id选择器>类>*>继承>默认选项；
Javascript基本知识点:
javascript:基于对象和事件驱动并具有相对安全性的客户端脚本语言；
javascript简介：*用途：制作页面交互效果，如轮播图的切换、tab栏切换、地图、表单。
*脚本语言：嵌入在html中，由浏览器解析执行
js核心内容：基础语法（重点） 变量 表达式 循环
dom（重点）js控制一些html元素
bom（了解）控制浏览器的一些东西
1.js代码引入位置：
<script type = "text/javascript">
//js代码写在这对标签里
alert（“......”）；完整写法 window.alert（“消息”）；
</script>
2.alert("消息"); 在浏览器中，弹出一个窗口；
3.语法规则:
a. js对换行、空格不敏感；
b. 每句末尾，必加；；
c. 都在英文状态下输入；
4.注释：
a.html的注释<!--...-->;
b.css的注释/*...*/;
c.js的注释 单行注释 //；
多行注释 /*...*/;
5.直接量（常量）
6.变量（未知数）js中用来储存不同数据（以字母开头或者以下划线，以$符开始的变量）；
7.typeof判断数据类型，结果是number表示是数值（整数或小数）；string是字符串；
8.外链式写法：<script type="text/javascript" src="引入文件”></script>
9.confirm("...");弹窗显示 一般与if...else配合显示；
prompt（“请你输入一个数”）用户输入的信息都是字符串；
document.write("...”)往网页中输入信息，而且参数可以放置；
10.变量值的传递：a=b； 含义：将b的值赋予给左边的变量a，但b不变；
11.程序流程结构：
a.顺序结构：程序从上往下，一句句执行；
b.条件结构：if if-else等；
c.循环结构：while、for、do-while；
12.Math.floor(number) 向下取整；
Math.ceil 向上取整；
Math.round 四舍五入；
13.==不全等于; ===全等于; 布尔值 true false; !=不等于；！==不全等于；&& 并且；
|| 或；！取反；
14.a++与++a都是表达式，表达式是有值的，a++表达式的值用a原来的值，++a表达式的值用a加1后的值；
15.数组定义 var arr = new Array（）；//通过new来创建；
var arr2 = [ ];
16.javascript的特点：
a.一种解释性执行的脚本语言（也是一种解释性语言）；
b.一种基于对象的脚本语言；
c.一种简单弱类型脚本语言；
d.一种相对安全脚本语言；
e.一种跨平台性脚本语言；
17.函数含义：对一段js代码进行封装，便于反复使用，提高代码的复用性；
18.变量的作用域：全局变量和局部变量
全局变量：a.在最外层声明的变量；
b.在函数体内部，但是没有声明var的变量也是全局变量；
局部变量：在函数内部 ，通过var声明的变量（局部变量的有效范围在本身所在的{ }内）；
隐式全局变量：在函数内部来用var申明的变量，并在函数处也没有申明的系统默认为全局变量；
19.事件三要素：a.事件源：一般是个名词，表示事件的来源；（开关 发起者 被触发者）
b.具体的事件（行为或动作）单击 双击 鼠标悬停；（打开）
c.事件处理程序：当事件发生，做什么？（灯亮）
20.onmouseover 当鼠标移入； onmouseout 当鼠标移出；
onmousedown 当鼠标按下时； onmouseup 当鼠标按下时；
onfocus 获得焦点； onblur 失去焦点；
onclick 点击 onchange 值改变；
21.js入口函数：
window.οnlοad=function( ){ //窗口加载完执行里面的代码 }；
22.js数据类型：字符串、数值型、布尔类型、null、object、undefind；
23.获取表单的值：text.value ；
24.函数参数：a.函数名.length得到形参个数；
b.arguments.length得到实参个数；
变量提升：在函数内部通过var声明的变量，无论这个变量在什么位置定义，都先把声明放在前面，赋值放在定义的位置；
25.找元素：a.通过id的值；
b.通过标签名；
26.定义函数：考虑参数设置arr，接受传来的数组；
27.排他思想：先干掉其他所有，最后剩下自己一个在处理；
28.变量和属性：a.变量：独立，自由自在，在有效范围内大家都可以用；
b.属于某个对象的；对象属性或对象方法（）；一个对象可以设置或添加属性；
29.数组的常用方法：
a.添加元元素：arr.push（）；push（）方法在数组的末尾添加一个或多个元素，返回的是数组的长度； unshift（）从数组的前面放入元素；
b.删除元素：pop（）移除最后一个元素； shift（）移除第一个元素；
数组的连接concat（）该方法用于连接两个或多个数组，不会改变原来的数组，返回的是连接的数组的一个副本；
c.把数组转为字符串：join（）作用是将数组各个元素是通过指定的分隔符，进行连接成为一个字符串；
d.把字符串转为数组：split（）用于把一个字符串分隔成字符串数组；
30.节点（标签 元素 节点）：
元素节点：每一个HTML标签；
文字节点：标签中的文字；
属性节点：标签的属性；
访问节点
getElementById（）id访问节点；
getElementByTagName（）标签访问节点；
getElementsByClassName（）类名 兼容问题；主流浏览器识别，ie6，ie7，ie8不识别；要想任何浏览器都识别这个方法，需要自己封装
*****封装自己的类；
parentNode 父节点
兄弟节点：下一个兄弟 nextSlibling ie6,ie7,ie8识别；nextElementSibling 其他浏览器识别；
兼容处理：one.nextElementSibling||one.nextSil 上一个与下一个兄弟同理；previouSibling previousElementSibling；
子节点（不常用，几乎很少用）
firstChild 第一个孩子； ie7,ie8识别 firstElementChild 正常浏览器识别（空格也算孩子） lastChild 最后一个孩子； lastElementChild；
孩子节点（重点）
childNodes选出全部的孩子 利用nodeType==1 获取元素节点；
children选择所有的孩子，仅仅选择的是元素节点（庶出，推荐使用）；
demo节点操作：新建节点、删除节点、克隆节点；
新建节点 creatElement 插入节点appendChid insertBefore子节点添加孩子 getAttribute（属性）获取属性；
31.var time = new Date（）；
getFullYear（） 年；getMouth（）月；getDay（）星期；getDate（）日；getHours（）时；getMiutes（）分；getSeconds（）秒；
32.setInterval 定时器；clearInterval清除定时器；setTimeout定时器执行一次关闭；
33.this指的是事件源或者函数调用者；
34. even 对象；
35.screenX screenY 光标相对于屏幕的x/y的值；
pageX pageY 光标相对于当前页面（网页）的x/y值；
clientX clientY 光标相对于可视区的x/y的值；
36.window.scrollTo（x，y）让窗口滚动到某个位置；
37.joson一种轻量级的数据交换格式，js的一种表现法；
38.事件冒泡：当一个元素的事件被触发，同样的事件会在这个元素的所有祖先元素上触发，这种过程叫事件冒泡；
JQuery基本知识点：
1.基本使用：jquery是js的一个库，把我们开发过程中常见的功能进行了封装，放在一个文件里，这个文件就是库文件；
2.jquery的入口函数：
a.$(document).ready(function( ){ //代码 });
b.$(function( ){ });
c.JQuery(function( ){ });
3.eq( );找元素； odd（）序号为基数，对列行数为偶数；even（）序号为偶数，对列行数为基数；
$(" ").find(" ");找具体的某一个元素；
4.addClass 添加样式； removeClass 移除元素； hasClass 在样式上来回切换；
5.show（）显示 作用：让元素展示出来； hide（）隐藏 作用：让元素隐藏起来；
6.slideUp（）向上滑动；slideDown（）向下滑动；slideToggle（）向上，向下切换；
7.自定义动画：所有能够执行动画的属性必须只有一个数字类型的值；
停止动画：stop（）;
8.fadeIn （）淡入；fadeOut（）淡出；fadeToggle（）淡入淡出切换；
9.append （）添加元素；clone（）复制元素；html（）创建元素；remove（）清除元素；
10.attr（）获取属性；removeAttr移除属性；
checked、selected、disabled要使用prop（）方法；
11.值和内容：
val（）获取内容方法 作用：设置或返回表单字段的值；例如：input，select，textarea的值；
text（）方法 设置或获取匹配元素的文本内容；
12.scrollTop（）作用：获取或设置元素垂直滚动的位置，有参数是设置，无参数时获取；
13.each方法：一般针对不同的元素设置 不同的操作；
14.简单事件：——bind方法——delegate——on；
15.unbind（）对通过bind方式绑定的事件进行解绑，解绑指定元素的某个事件；
16.undelegatete（）对通过delegate方式进行解绑——产生事件冒泡（进行解绑是对父级元素进行解绑）；
17.trigger 让某个元素的事件触发；triggerHandler 触发事件响应方法；
18.target属性 表示真正触发事件的元素；
19.keydown键盘按下；
20.siblings（）获得匹配集合中每个元素的同胞，通过选择器筛选是可选的（其他的兄弟，不包括自己）；
