jquery 解绑_JQuery

学习主题：JQuery

学习目标：

1 掌握Jquery操作文本和值

2 掌握Jquery的事件

1. 操作页面元素的属性2

(1) 想要操作元素的属性有几种方式，请列举。

//获得id名称是inp1对象节点
var inp1=document.getElementById("inp1");
//方式一： 获得元素的属性
var ty=inp1.type; var va=inp1.value; var na=inp1.name;
//操作元素的属性
inp1.type=”button”;
inp1.value="测试改变";
//方式二： 获得元素的属性
var ty1=inp1.getAttribute("type");
//获得属性的默认值
var va2=inp1.getAttribute("value");
//方式二： 操作元素的属性
inp1.setAttribute("type","button");

//上面是js原生的，下面是jQuery的
tex.attr("type","button"); 
tex.attr("value","测试按钮"); 
//支持json数据格式 
tex.attr({"type":"button","value":"测试按钮"}); 
var ch= $("#fav").attr("checked"); 
var flag=$("#fav").prop("checked",true);

(2) attr("checked")和prop("checked")这两个操作方式有什么区别？使用场景是什么？

• attr("checked")：可以获得checked属性的值，但是无法修改
• prop("checked")：可以修改，在需要在方法里面或者是事件里面修改该属性时使用

1. 对于checkbox，如果没有定义checked="checked"，alert($.attr("checked")) 的结果是undefined。
2. 用prop方法，则输出的是true或者false， $("input[type='checkbox']").prop("checked", true);
3. 修改checked 使用prop更适合。
4. 修改固有属性时，最好使用prop；
5. 修改自定义属性时，使用attr。

(3) prop("checked",true) 这句代码是什么意思。

答：将对象的checked的属性值设置为true

2. 操作页面的文本和值1

(1) 请写出html()和text()在获得值得时候两者的区别,和使用的场景。

• html()：获得元素的内容 相当于js里面调用innerHtml
• text()：获得文本内容 相当于js里面调用innerText

使用场景根据使用需求不同决定吧，例如需要获得纯文本时使用text方法，否则使用html

(2) 请说出val()和html()在获得值得时候两者的差异。

val()：单标签获得值时使用

html()：一般是双标签使用用来获得value值，select 、textarea 两个标签获得值得时候需要用val()

3. 操作页面的文本和值2

(1) 请写出html()和text()在赋值得时候两者的区别,和使用的场景。

答：上同

(2) 请说出val()和html()在赋值得时候两者的差异。

答：上同

4. 操作页面的元素1

(1) 请问appendTo 和append两个方法之间的区别是什么？

• appendTo：与下面相反
• append：为调用该方法的对象增加子元素到最后

(2) 请问prepend和prependTo两个方法之间的区别是什么？

• prependTo：与下面相反
• prepend：为调用该方法的对象增加子元素到最前面

(3) 请说出before和afterd的使用场景是什么

• before：平级的添加元素，在调用者元素之前
• after：平级的添加元素，在调用者元素之后

5. 操作页面的元素2

(1) 请问replaceAll("div p:nth-child(5)");代码是什么意思？

答：调用该方法的对象取代div下的第五个p元素

(2) 请问replaceWith()和replaceAll()方法之间的区别是什么?

答：主动和被动的关系

• replaceWith()：用参数取代调用者
• replaceAll()：用调用者取代参数

(3) 请问 remove()和empty()之间的区别是什么？

答：remove()是删除掉调用者；empty()是清除掉调用者的所有子孙级对象

6. 事件处理1

(1) 请说出 bind() 事件的作用和使用场景是什么？请列举

答：可以一次绑定多个事件，内容支持json格式

/*****使用bind绑定的好处*****/
//内容还支持json数据格式
$("#bu2").bind({
	'click':function(){},
	'dblclick':function(){},
	'blur':function(){}
})

(2) one()事件的使用的场景是什么？

答：当希望绑定在对象上的事件只执行一次时使用

7. 事件处理2

(1) 请说出trigger()这个事件的作用和使用，我们可以在什么位置来使用这个标签？

答：trigger()事件后，会发生trigger()指定的事情，就是触发，在数据库里面也有相似的操作；我们可以在希望一次性执行多个事件时使用该操作

(2) 在JQ中如何可以解绑一个对象上的所有事件，如何解绑一个对象上的单个事件？

答：如果直接执行unbind方法就会解绑一个对象上的所有事件；如果传了参数指定了就会解绑一个对象上的特定事件

(3) live这个方法是解决什么问题的，现在还继续使用吗？

答：live是为了解决动态添加节点元素时，使里面的事件生效的方法，但是现在不使用了