前端部分总结
（概念、应用性、如何应用）
1.HTML
a)HTML5 html第五个版本<视屏处理,兼容<手机,pc>>
2.CSS
a)语法选择器{属性:值;属性:值} id选择器# class选择器.标签选择器
b)常用样式:1.背景样式，2.文字相关,3.文本4.边框的样式,5.盒子模型。
c)导入外部样式的方式@import "test.css"
<link rel="stylesheet" type="text/css" href="test.css" />
d)Css3 css第三个版本<样式增加,兼容性>
概念：层叠样式表（英语：Cascading Style Sheets，简写CSS），又称串样式列表、级联样式表、串接样式表、层叠样式表、階層式樣式表，一种用来为结构化文档（如HTML文档或XML应用）添加样式（字体、间距和颜色等）的计算机语言
3.JS（JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。
）
a)控制客户端元素dom模型
<window->document<getElementById,getElementsByName,getElmentsByTagName
>,history,location,status>
b)表单验证:
正则表达式\w \W \d \D [4,9] ? +
4.Ajax:异步数据的请求和响应,提供静态和服务器数据交互减少跳转,客户体验更好,减少网
络流量
a)创建xmlHttpRequest对象
i.属性
1.onreadystatechange
2.readyState0 1 2 3 4
3.status 200400
4.responseText
ii.方法
1.Open(url)
2.Send(data)
<script>
varxmlHttprequest;
function validateServer() {
//创建XMLHttpRequest对象
if (window.XMLHttpRequest) {
xmlHttprequest = new XMLHttpRequest();
} else if (window.ActiveXObject) {
xmlHttprequest = new ActiveXObject("Microsoft.XMLHTTP");
}
//异步请求到哪里?
xmlHttprequest.open("GET","http://localhost:8080/springmvc_spri
ng_mybaties_bootstrap/validate.do,true);
//设置属性。
xmlHttprequest.onreadystatechange = doMessage;
xmlHttprequest.send(no="+document.getElementById("inputNo").v
alue);
}
function doMessage(){
if (xmlHttprequest.readyState == 4 &&xmlHttprequest.status == 200)
{
alert(xmlHttprequest.responseText);
}
}
</script>
5.Jquery:轻量级<200多kb>的js函数库，内置浏览器的判断和界面兼容性
a)语法:支持链式写法$
b)选择器:id ,class,标签,混合.
c)函数
i.事件相关的函数click(function(){}) blur load ready
ii.样式相关的函数css()
例如:$("p").css({ color: "#ff0011", background: "blue" });
iii.文档相关函数:append() ,after,before,remove,replaceAll,clone
iv.动画:
1.基本动画show ,hide,slideUp(切入),slideDown,fadeIn(淡入),fadeout
2.自定义动画<修改样式>animate
v.Ajax相关函数:
1.Ajax({url,type,datatype,data,success})
2.Post
3.Get
Json：以javascript{}[]语法定义一组数据,轻量级数据传输方式,在客户端解释更方便
[{name:wl,age:20,sex:男},{name:wfd,age:30,sex:男}]
Java中转json格式:JSONArray.fromObject(list).toString()
6.jquery插件:easy-ui,jquery-ui,dwz
7.防止重复提交:1.客户端通过禁用和启用按钮<disable>,服务器端防止重复提交:
/submitted-by-spring-mvc-to-prevent-data-duplication
8.浏览器的兼容性处理:使用兼容性好的框架<jquery>,
/note/314793848/
9.Bootstrap:html,css,javascript前端框架,简化客户端的开发
来自Twitter，是目前很受欢迎的前端框架。
Bootstrap 是基于HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得Web 开发更加快捷。
它由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。
Bootstrap提供了优雅的HTML和CSS 规范，它即是由动态CSS语言Less写成。
Bootstrap一经推出后颇受欢迎，一直是GitHub 上的热门开源项目，包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目。
国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来
常用的样式:
与表格相关的样式:
.table<全屏普通表格>、
.table-striped<带条纹背景的表格>、
.table-bordered<带边框的表格>、
.table-hover<带悬停高亮的表格>
.table-condensed<紧缩的表格>
与表单相关的样式:
from-group:表单元素组
from-control:控件的样式
btnbtn-info danger waring标准按钮
.form-search搜索表单
.form-inline行内表单
.form-horizontal横向表单
.。