一.操作页面的文本和值
a.获取到文本
- 获取文本内容(含有html标签):var ht = div.html();
- 获取文本内容(不含有html标签):var ht = div.text();
- var ht = te.val();获取文本框实时输入的值
b. 操作文本的值:
- div.html("<h1>Text</h1>");更改div中的文本值带html标签
- div.text("<h1>Text</h1>");更改div文本值,不带html标签
- div.text(div.text()+"<h1>Text</h1>");实现累加文本效果
- te.val("cxx");更改文本框里面的值
二.操作页面的元素
1.添加元素
- 创建一个新的元素var p = $("<p>text</p>")
第一种写法:
- 在元素里面 增加一个新元素,并且添加到现有元素的后边$("#div1").append(p);
- $("#div1").prepend(p);添加到现有元素之前
- $("#div1").before(p);在div前面添加一个同级元素
- $("#div1").after(p);在div后面添加一个同级元素
- $("div p:nth-child(2)").replaceWith(p);将元素内的某一标签替换
- $("#div1").remove();删除指定的元素
- $("#div1").empty();清空指定元素下的内容
第二种写法:
- p.appendTo("#div1");将元素添加到指定元素中取。并且添加到现有元素的后边
- p.prependTo("#div1");将元素添加到指定元素之前
- p.insertBefore("#div1");将p添加为当前对象之前,插入为div的同级元素。
- p.insertAfter("div");将p添加为当前对象之后,插入为div的同级元素。
- p.replaceAll("div p:nth-child(2)");将元素内的某一标签替换
2.事件
- $("").click()绑定单击事件
- $("").bind("事件名",function(){})绑定事件
- $("").bind({key:value})多事件绑定
- $("").one()一次事件得绑定
- 在一个方法中调用其他得方法在方法中写入div.trigger("时间名字")
- $("").unbind()事件得解绑,不填写内容全部事件解绑,写入事件名字,解绑该事件
- $("").live("")无论什么时候加载得事件都可以使用jquery1.7之前可以用,之后版本废弃
3.动画
- div.hide(2000)在2s后实现隐藏效果
- div.show(2000);显示效果
- div.toggle(2000);让隐藏的显现出来,显现的隐藏过去
- div.slideUp(2000);在2s内 滑倒上边
- div.slideUp(2000);div.slideDown(2000);滑下只有连用才可
- div.slideToggle(2000);2s滑动上的滑动下,滑动下的滑动
- div.fadeOut(2000);2s淡出
- div.fadeIn(2000);2s淡入
4.jequery底层封装原理
Jquery是利用匿名函数的自调用与闭包原理将js的功能给封装起来的。形成一个jquery包库,形成一个自执行函数,并且将window对象作为参数传递进去,方便了整体的调用。
(1)闭包的优点与定义
- 闭包:在其他的方法里调用成员变量
- 优点1.可以减少全局变量的使用,造成全局变量过于庞大而难以维护 2.可以防止变量的修改,内部变量外部无法访问所以不能修改,因而比较安全 3.读取函数内部值得时候,其初始值是保存到内存中而不被改变得