HTML简介
什么是HTML
- HTML(Hyper Text Markup Language)是描述网页的语言
HTML标签
- 所有的内容都是放在标签内部的
- 用两个尖括号及其内部的标签名表示标签
<html> </html>- 一般情况要有开始和结束标签
编辑器
- 记事本也可以写html，只要保存时选择.html的格式即可以
- 一般的编辑器都可以编写，好的编辑器可以自动补全
固定格式
- 基本上所有的html都是由以下主干扩充的
<html>
<head>
</head>
<body>
</body>
</html>- 结束标签一定要写，虽然有的浏览器即使没有结束标签也能正常显示
基本元素
- 标题
<h1>标题1最大</h1>
<h2>标题2</h2>
<h3>标题3</h3>
<h4>标题4</h4>
<h5>标题5</h5>
<h6>标题6最小</h6>- 段落
<p>段落</p>- 水平分割线
这是少有的没有结束符的（开始符合结束符在一起）的标签
<hr />- 注释
<!-- 注释 -->- 拆行
<p>这是<br />分开的<br />段落</p>- 样式
<h2 style="样式=背景色：红色</h2>
<h2 style="font-family:verdana">样式=字体：verdana</h2>
<h2 style="font-size:10px">样式=大小：10像素</h2>
<h2 style="color:red">样式=颜色：红色</h2>
<h2 style="text-align:center">样式=对齐方式：居中</h2>
<h2 style="font-size:10px;color:red">样式之间可以用分号隔开</h2>
- 文本格式化
<b>文字加粗（以下均没有自动换行）</b>
<br />
<big>文字变大</big>
<br />
<small>文字变小</small>
<br />
<em>文字斜体</em>
<br />
可以单独写一个没有标签的文字
<sub>下角标</sub>
<sup>上角标</sup>- 预格式文本
<pre>
预格式文本
保留了 空格
与换行
很适合显示代码等文本
</pre>- 地址描述
<address>
Written by jbw<br />
你要是非问他和普通的斜体有什么不同<br />
我觉得应该是要规范要求吧<br />
这里同样是不带自动回车的
</address>- 引用
<p>长引用</p>
<blockquote>这是一段长引用，长引用会自动形成一段，同时有首行缩进。这是一段长引用，长引用会自动形成一段，同时有首行缩进。</blockquote>
<p>短引用</p>
<q>短引用会自动被引号引起来</q>- 删除文字与插入文字效果
<p>正常文字 <del>中间有删除线的文字</del> <ins>有下划线的插入文字</ins> 正常文字</p>- 缩写
<abbr title="这是缩写的全称">这是缩写，下面带了一行小点点</abbr>
<p title="这是缩写的全称">这是缩写</p>- 超链接
<a href="http://www.baidu.com">文字链接</a>
<a href="http://www.baidu.com">右面的图片是链接<img border="0"src="C:\Users\bwjiang\Desktop\photo.jpg" /></a>
- 插入图片
<img src="C:\Users\bwjiang\Desktop\photo.jpg" alt="当浏览器没有显示出图片时，显示本段文字"/>
HTML CSS
什么是CSS
- 层叠样式表，从HTML4.0之后的样式都建议从html文档中剥离样式，写到css文件中
- 例如描述文字大小、颜色、位置等的信息都写到css文件中去
- 在Chrome浏览器上按F12可以看到页面的源码
-
源码一般都是把样式剥离出来了
-
层叠样式表，从HTML4.0之后的样式都建议从html文档中剥离样式，写到css文件中
- 例如描述文字大小、颜色、位置等的信息都写到css文件中去
- 在Chrome浏览器上按F12可以看到页面的源码
-
源码一般都是把样式剥离出来了
1.外部样式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>- 推荐使用外部样式表，在每一个页面的html中都可以使用css里面的样式
- 前面的rel规定当前文档与被链接文档之间的关系，stylesheet表示样式表
-
mystyle.css表示样式表和当前html在同一个目录下
2.内部样式表
- 在head标签里定义style标签，可以在本html文档中将css文件里的样式做继承
-
不建议使用
3.内联样式表
- 在某一个标签内部加入style，单独改变这个标签
- 不建议使用，建议全部采用外部样式表
（后面会对css进行专门的学习）
基本元素
- 链接
<a herf="www.baidu.com">nihao</a>链接里面也可以插入标签
<a herf="www.baidu.com"><img src="apple.jpg"></a>链接不仅仅只能指向其他的网页，也可以指向本网页的其他的地方（锚
）
就像百度百科前面的目录一样
<a name="miao">miao</a><a herf="#miao">miao</a>把name替换成id也可以
<a herf="www.baidu.com" target="_blank">nihao</a>在新窗口打开target=”_blank”
从根目录寻找网页target=”_top”
- 图片
<img src="/img/p.jpg">body 可以加上background=”background.jpg”
width属性调整宽度
height属性调整高度
- 表格
<table>
<tr>
<th>表头</th>
</tr>
<tr>
<td>第一行第一列</td>
</tr>
</table>- 列表
1.无序列表
<ul>
<li>nihao</li>
<li>zaijian</li>
</ul>2.有序列表
<ol>
<li>nihao</li>
<li>zaijian</li>
</ol>- 块级元素
<div>
</div>- 内联元素
将文本分块
<span></span>- 类
在css文件或者head中的style里
之后就可以在块中加入class=“left”
.left{
text-align: left
}或者可以对已有的表现设置内部的类
然后在之后的p标签内部可以加入class=“left”
p.left{
text-align: left
}- 布局
在css文件中用井号开头，在html的div中id=“”
- 响应式设计
这个要求有点高，有时间我再看
- 头部标签
<title>题目 必须要有
<base target="_blank" />新窗口打开
<meta>关键字 作者 描述
<link rel="stylesheet" type="text/css" href="mystyle.css" />链接外部资源
}CSS基础（一）
本文参考了http://www.w3school.com.cn/css/
什么是CSS
- 层叠样式表 (Cascading Style Sheets)
- 可以独立与html文档，存在于.css文件中
- 可被应用到多个html文档中
- 可以使html文档专注的表示文档内容而不需要考虑样式
优先级
- 最高：内联样式，在标签内部声明
- 其次：内部样式，在head标签声明
- 再次：外部样式，在.css文件中声明
- 最后：浏览器的缺省设置
基本语法
selector{
property1: value1;
property2: value2;
}- selector可以多个同时赋值，用逗号隔开
- 属性后面一定要加冒号，习惯性加一个空格
- 值的后面加分号，如果是两个单词或以上要加引号
关于继承
- 不是每个浏览器都支持继承，一般来说规定了父标签之后，紧接着规定字标签的属性
派生选择器（上下文选择器）
- 规定某一标签在另一标签内部时的样式
- selector2在selector1内部时属性满足如下条件
selector1 selector2{
property1: value1;
property2: value2;
}id选择器
- 在标签中标记id，id在css文件中
- css文件
#idname{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body id="idname">
</body>
</html>类选择器
- 在标签中标记class，class在css文件中
- css文件
。classname{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body class="classname">
</body>
</html>- 也可以规定类内的标签样式
.classname p{
property1: value1;
property2: value2;
}- 也可以规定标签内部的类
p.classname{
property1: value1;
property2: value2;
}属性选择器
- 在标签中标记属性，属性在css文件中
- css文件
[tittle]{
property1: value1;
property2: value2;
}- html文件
<html>
<head>
<tittle>timu</tittle>
</head>
<body tittle="prop_name">
</body>
</html>- 上面规定所有标签内部有 tittle=”“的都满足上述属性
- 在css文件中也可以这样定义
- css文件
[tittle="big"]{
property1: value1;
property2: value2;
}上面规定所有标签内部有 tittle=”big”的都满足上述属性
- 我觉得属性选择器相当于自己定义了一个类之类的东西
- 在input这样的不能用类的标签中就需要属性选择器了
CSS基础（二）
本文参考http://www.w3school.com.cn/css/index.asp
背景
- 可以设置任何标签的背景（包括整个页面）
background-color: grey; //背景色
background-image: url(); //背景图片，括号内部填写地址
//可以在.css文件中设置背景
padding: 20px; // 周围留下20px的边界
//如果不管是否重复，背景会自动复制填满整个标签内部
background-repeat: repeat-y; //只在y方向复制，同理有只在x方向复制
background-repeat: no-repeat; //不复制
background-position: center; //位置居中，同时还有top、bottom、left、right，也可以成对出现，还可以写成px和cm
background-position: 40% 60%; //x方向左数40%，y方向上数60%
background-attachment: fixed; //背景的位置固定，不随着滑轮滚动而变文本
color：red； //设置文本颜色
background-color: yellow; //设置文本的背景色
word-spacing： 5px; //字间距
letter-spacing: 10px; //字符间距
//标准的行高认为是字的110%-120%
//可以用百分比、像素值、数值等设置行高
line-height: 90%; //行间距为-10%
line-height: 200%; //行间距100%
text-align：center; //文本对齐方式设为居中，还有left、right
text-decoration: overline; //overline上划线、line-through中划线、underline下划线、blink（说是会一闪一闪，但是我没看到）、none去掉装饰（超链接的下划线可以去掉）
text-indent: 1cm; //首行缩进
text-transform: uppercase; //字母全部变大写，lowercase全部变小写，capitalize每个单词的首字母大写
字体
font-family//字体
font-style//风格 normal正常 italic斜体 oblique倾斜，后两个差不多
font-varitant: small-caos; //大写变小的大写
font-weight: normal;//bold加粗 500正常 100最细 900最粗
font-size: 20px//文本大小，也可以用em（16px），100%链接
a:link {color:#FF0000;text-decoration:none;} /* 未被访问的链接 */
a:visited {color:#00FF00;background-color:#B2FF99;} /* 已被访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标指针移动到链接上 */
a:active {color:#0000FF;} /* 正在被点击的链接 */JavaScript基础（一）
什么是JavaScript
- 基于页面的脚本语言
- 轻量级
- 可以插入到html中
- 基本上所有的浏览器都支持
- 和java完全不同
标签
浏览器会执行这个标签里面的脚本
<script>
</script>位置
这一段脚本习惯性放在head里或者body内部的下面
但是更多的还是单独放在一个文件里，然后将文件导入
<script src="myScript.js"></script>寻找某一个id
javascript通过寻找html中的某一个id来确定具体的标签
document.getElementById("demo").innerHTML="我的第一段 JavaScript";上面这句代码可以把demo标签的原始内容替换为”我的第一段 JavaScript”
document.write("<p>我的第一段 JavaScript</p>");上面这句代码向屏幕上输出一个段落，注意！只能在页面刚刚加载的时候使用，如果加载过后使用则会覆盖页面
分局
分号对于javascrip而言是可选的
函数
函数前面需要加上function
function functionName(){
}代码换行
建议不要使用，在字符串之间可以用 换行
注释
和c的注释完全相同//或/* */
变量
用var来声明变量
数组
var a = new Arry('q', 'w', 'e', 'r')面向对象
javascript是面向对象的语言，所有的变量都是对象
var person={
firstname : "Bill",
lastname : "Gates",
id : 5566
}使用对象中的属性时建议
person.firstname使用对象中的方法时建议
person.eat()调用函数
很多标签都可以加上onclick=“myfunction()”
由此既可以调用函数
返回值
函数都可以返回，返回时不需要指定函数类型
运算符、比较符、逻辑运算符
+-*、%<>= == != >= <= && || !
各种符号的意义均与普通无异
基本语句
if(){}else{}
switch(){case1:break;default:break;}
for(;;)
while
break;continue;
try throw catch
表单验证
利用id把value读出来进一步验证
alert（）可以输出警告
console.log()可以打印日志
JavaScript基础（二）
Html DOM
- DOM是文档对象模型（Document Object Model）
- javascript可以通过寻找标签的id找到对应的标签
- 对找到的标签可以做很多操作
- 包括修改，删除
- 也可对实践做出反应
找到标签
- id找标签
- x=document.getElementById(“demo”);
- name找标签
- x=document.getElementByName(“demo”);
- 类名找标签（找到所有段落的）
- x.getElementsByTagName(“p”);
写入内容
- 写入到输出流
- document.write();
- (注意，如果要输出字符串，必须要有引号，输出变量和数字不用)
- 改变元素内容
- x.innerHTML=”new text”;
- 改变元素属性
- x.src = “newimg.jpg”;
改变样式
- x.style.color = “blue”;
- x.style.visibiliyu = “hidden”;//设为隐藏和不可见
本篇省去了很多深入的知识，只是适用于对javascrip的大体框架做一了解，更多详细的知识请查看w3school
对行为作出反应
- 点击
- onclick=“”（引号里面可以加一个语句或者一个函数）
- 页面加载
- onload=“”//加载成功时执行
- onunload=“”//加载失败时执行
- 由于不同浏览器对于一些函数的支持不同，这两个反应可以区分不同浏览器
- 鼠标悬停
- onmouseover=“”//鼠标在此标签上方悬停时执行
- onmouseout=“”//鼠标离开后执行
- 如果onmouseout的结果和一开始不同，离开后不会回到一开始的状态
- 改变
- onchange=“”//值改变后执行
- 按住和离开
- onmousedown=“”//鼠标按下不放
- onmouseup=“”//鼠标松开后
- 和鼠标悬停一样，如果松开后的效果和一开始不同，松开后不会回到一开始的状态
- 发现一个小bug，按下后把鼠标一直按下脱离标签区域再松开，发现标签会一直保持按下状态
- 聚焦
- onfocus=“”//一般只对input标签使用，点击输入框之后执行
增加新节点（标签）
- 创建新标签
- var para=document.createElement(“p”);
- 创建标签文本内容
- var node=document.createTextNode(“这是新段落。”);
- 为这个标签添加文本内容
- para.appendChild(node);
- 找到一个节点并加入
- var element=document.getElementById(“div1”);
- element.appendChild(para);
删除节点（标签）
- 找到要删除的节点
- var child=document.getElementById(“p1”);
- 找到要删除节点的父节点
- var parent=document.getElementById(“div1”);
- 删除掉这个节点
- parent.removeChild(child);
- 也有快捷办法
- document.getElementById(“p1”).parentNode.removeChild(child);
JavaScript对象
- 和所有面向对象的语言一样，javascriot也有对象
- 对象有其属性与方法，方法就是
创建对象
- 构造函数（这个构造函数和java不同）
- 这里没有类的概念，原来java的类的位置就是现在构造函数的位置，类变量就可以看成是这里对象数属性
- 如下面的程序，上半部分是构造函数，下面是这个对象的一个方法
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}
}for in 循环遍历对象属性
var person={fname:"Bill",lname:"Gates",age:56};
for (x in person)
{
txt=txt + person[x];
}数字
- 所有数字都是64位的
- 浮点数计算不精确，如果要计算最好先化为整数，再做除法
- 整数最多15位
- 八进制前面加0，十六进制前面加0x
字符串
- .length //求字符串长度
- .big //变大
- .small//变小
- .bold//加粗
- .itallics//斜体
- .fixed//变细
- .strike//划掉
- .fontcolor//字体颜色
- .fontsize//字体大小
- .toLowercase//全小写
- .toUppercase//全大写
- .sub//下标
- .sup//上标
- .link//链接
- .indexof//首次出现的位置，不在为-1
- .match//匹配，返回匹配的或null
- .replace(/bereplaced/,”replace”)//替换
日期
- Date() //获取时间
- getTime()//获取时间戳
- getDay()….hours，seconds….很多很多就不列举了
数组
略
布尔型
- “false”是true
- “”是false
算数Math
- .round()//四舍五入
- .random()//0-1的随机数
- .max，min
正则表达式
- 比如在验证邮箱的时候使用，验证是否是规定格式的
JavaScript基础（三）
浏览器对象模型
- BOM (Browser Object Module)
- 是的页面和代码之间可以对话
- 一般都是以window开头的一系列属性和方法
- window可以不写
window
window.document.getElementById("header"); //找id为header的标签
window.innerHeight//浏览器内部高度
window.innerWidth//浏览器内部宽度
.open(src)//打开新窗口
.close()//关闭本窗口
.moveTo()//移动当前窗口
history
history.back()//可以用来制作返回按钮
.forward()//前进按钮（要曾经使用过返回按钮才可以）消息框
- 警告框
- alert(“文本”)
- alert(“你好” + ‘ ’ + “再见”)
- 确认框
- confirm(“文本”)
- 返回一个布尔型变量
- 提示框
- name=prompt(“请输入您的名字”,”Bill Gates”)
- Bill Gates在输入框内提前给出作为提示
时间
- 在t时间后执行引号内部的代码
- setTimeout(“”，t)
- t单位为毫秒
- clearTimeout()
- 取消setTimeout
cookie
- 省略，在javascript基础（二）中提到过
- 可用于保存用户名和密码，下次就不需要重新输入了
- 可以设置保存的时间
JavaScript库
- JavaScript有很多强大的库很多企业都会采用JQuery
- 还有一些例如Prototype、MooTools
- JQuery是最受欢迎的JavaScript框架
JQuery框架
- 可以通过两种方式使用它
- 在官网上下载他的源文件或者精简源文件到本地，引入本地的地址
- 直接引入官网的地址
- 注意注意注意！！！
- JQuery的引入语句一定要在本地编辑的js引入之前
- jquery可以解决很多动态操作的问题，使得网页的UI更好
JavaScript基础（四）jQuery（一）
本文参考了w3schoolhttp://www.w3school.com.cn/jquery/
什么是jQuery
- jQuery是一个非常强大、非常非常好用的JavaScript库
- 可以极大地简化JavaScript编程
如何使用jQuery
- 在jQuery.com网站下载并添加到项目中去，在js中引入
- 可以直接从谷歌或微软提供的文件中从网络获取，直接添加网络中的路径
- 这样有一个好处是很多用户都已经加载过jQuery核心库了，不需要重新加载
- ！！！！注意！！！！
- 国内的网络大部分上不了谷歌，但是校园网可以，校园网开发者需要考虑到其他开发者无法下载
- 建议从微软上加载核心库
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>基本语法
- $(selector).action()
- $代表jQuery，如果和已有的其他库的重复，可以用jQuery的onconfilct()来更改
- selector代表要选的元素
- this代表本元素（注意：没有引号）
- “p”代表所有段落
- “.demo”代表所有class=“demo”的元素
- “#demo”代表所有id=“demo”的元素
- 当然也可以叠加使用
- action代表操作
选择器
接上一条的selector
- 元素选择器
- selector代表要选的元素
- $(this)代表本元素（注意：没有引号）
- $(“p”)代表所有段落
- $(“.demo”)代表所有class=“demo”的元素
- $(“#demo”)代表所有id=“demo”的元素
- 当然也可以叠加使用
- selector代表要选的元素
- 属性选择器
- $(“[href]”)所有带有属性href的元素
- $(“[href=’apple.jpg’]”)所有带有href属性而且href的值为apple.jpg的元素
- $(“[href!=’apple.jpg’]”)所有带有href属性而且href的值 不是 apple.jpg的元素
- ("[href=’.jpg’]”)所有带有href属性而且href的后缀为.jpg的元素
- css选择器
- $(this).css(“backgroung-color”, “red”)
事件
jQuery有很强的事件处理能力
$(document).ready(function(){
//文档加载时粗体就隐藏
$(b).hide();
//点击id=“button1”时段落隐藏
$(#button1).click(function(){
$(p).hide();
});
//双击id=“button2”时斜体隐藏
$(#button2).dblclick(function(){
$(i).hide();
});
//input获得焦点时段落隐藏
$(input).focus(function(){
$(p).hide();
});
//鼠标悬停在button3上段落隐藏
$(#button3).mouseover(function(){
$(p).hide();
});
});效果
隐藏、显示
可以用于设置“刷新”、“进入”、“删除”等的效果
$(selector).hide(speed, callback); //隐藏
$(selector).show(speed, callback); //显示
$(selector).toggle(speed, callback); //切换（原状态隐藏则显示，原状态显示则隐藏）- speed为变换速度，可以为一下几个值
- 不写：一瞬间完成
- “fast”：快速完成（引号不能省）
- “slow”：缓慢完成
- 1000：1000毫秒完成
- callback：执行完隐藏或显示后执行的函数
淡入淡出
可以用于设置“刷新”、“进入”、“删除”等的效果
$(selector).fadeIn(speed,callback); //淡入
$(selector).fadeOut(speed, callback); //淡出
$(selector).fadeToggle(speed, callback); //切换（原状态隐藏则淡入，原状态显示则淡出）
$(selector).fadeTo(speed,opacity,callback); //淡出到某一透明度或淡入到某一透明度- opacity为透明度，0-1之间
滑动
可以用于“显示更多”和“收起”按钮的设置
$(selector).slideDown(speed, callback); //滑下展开
$(selector).slideUp(speed, callback); //滑上收起
$(selector).slideToggle(speed, callback); //切换（原状态隐藏则滑下展开，原状态显示则滑上收起）动画
可以对css参数进行调整形成动画
$(selector).animate({params},speed,callback);- {params}为参数列表
- 例如{left:’250px’}是距左端250px
-
- 例如{left:’+=250px’}是距现在位置的左端250px（反复点击会反复右移）
- 但是在标记属性名的时候必须用Camel标记法
- 必须使用 paddingLeft 而不是 padding-left
- 动画队列
- 可以反复调用animate函数，会按顺序执行
停止动画
停止指定动画
$(selector).stop(stopAll,goToEnd);- stopAll
- false（默认）不清空之后的动画队列
- true 清空之后的队列
- goToEnd：
- false（默认）本动画停在此位置
- true本动画停在最终应该结束的位置
链接
多个动作指令可以跟在一个对象后面，依次进行
$("#p1").css("color","red").slideUp(2000).slideDown(2000);
avaScript基础（四）jQuery（二）
Html有关的jQUery
获取内容
$("#test").text(); //粗体字确定得到的结果是：确定
$("#test").html(); //粗体字确定得到的结果是：<b>确定</b>
$("#test").val(); //可以得到输入框的值
$("#test").attr("href"); //得到href属性的值设置内容
$("#test").text("Hello world!");
$("#test").html("<b>Hello world!</b>");
$("#test").val("Hello world!"); //设置输入框的值
$("#test").attr("name"，"value");
$("#test").attr("name1":"value1",
"name2":"value2"
); - 回调函数
- 什么是回调函数
- 顾名思义，回到上一步
- 例如，这里要设置新的值，那么原先的值哪里去了？就在回调函数里面找
- 什么是回调函数
$("#test1").text(function(i,origText){
return "Old text: " + origText + " New text: Hello world!
(index: " + i + ")";
});- i为当前元素的位置
-
origText是原先的文字
-
attr()的回调函数在地址增加一段这种方面很好用
添加
$('p').append("inner append text");
$('p').prepend("inner prepend text");
$('p').after("ont after text");
$('p').before("out before text");
$('p').append(txt1,txt2,txt3);删除
$('p').remove(); //删除p
$('p').remove('b'); //删除p里面的b
$('p').empty(); //清空p改变样式表
- 增加
$('p').addClass('blue'); //增加一个样式表
$('p').addClass('blue big'); //增加两个个样式表
$('p, b').addClass('blue'); //两个标签都增加一个样式表- 删除
$('p').removeClass('blue'); - 交替
$('p').toggleClass('blue'); - 设置
$("p").css({"background-color":"yellow","font-size":"200%"});遍历
- 祖先
$("span").parent();
$("span").parents();
$("span").parentsUntil();- 后代
$("div").children();
$("div").find("");- 同胞
$("div").sibling();AJAX
- 异步JavaScript和xml（Asynchronous JavaScript and XML）
- 不重载整个网页，重新在xml中找到数据传到页面上，也包括文本，html，json
load()
$(selector).load(URL,data,callback);- URL是地址地址后面还可以加id号
- 例如$(“#div1”).load(“demo_test.txt #p1”);
- data是传给服务器的数据，服务器处理完后返回
- callback回调函数
- function(responseTxt,statusTxt,xhr)
- responseTxt - 包含调用成功时的结果内容
- statusTXT - 包含调用的状态
- xhr - 包含 XMLHttpRequest 对象
- function(responseTxt,statusTxt,xhr)
从服务器请求数据
注意！！这里和前面都不一样了，直接$.
//从服务器获得数据
$.get(URL,callback);
//先传递给服务器data，再获得数据
$.post(URL,data,callback);
//回调函数一般为function(data,status)，其中data为服务器返回的数据