jQuery扩展内容

1、jQuery的属性操作

html()      它可以设置和获取起始标签和结束标签中的内容。      跟 dom 属性 innerHTML 一样。
text()      它可以设置和获取起始标签和结束标签中的文本。      跟 dom 属性 innerTEXT 一样。
val()       它可以设置和获取表单项的 value 属性值            跟 dom 属性 value 一样。

$(function (){
            //不传参数，是获取，传递参数是设置
            //alert($("div").html());//获取
            //$("div").html("<h1>我是div中的标题 1</h1>");//设置

            //不传参数，是获取，传递参数是设置
            //alert($("div").text());//获取
            //$("div").text("<h1>我是div中的标题 2</h1>");//设置

// 批量操作单选
$(":radio").val(["radio2"]);
// 批量操作筛选框的选中状态
$(":checkbox").val(["checkbox3","checkbox2"]);
// 批量操作多选的下拉框选中状态
$("#multiple").val(["mul2","mul3","mul4"]);
// 操作单选的下拉框选中状态
$("#single").val(["sin2"]);

attr()      可以设置和获取属性值,不推荐操作 checked, readOnly, selected, disabled等等

            attr 方法还可以操作非标准的属性。比如自定义属性：abc, bbj

prop()      可以设置和获取属性值，只推荐操作 checked, readOnly, selected, disabled等等

 2、DOM 的增删改

内部插入：

appendTo()

a.appendTo(b)

把 a 插入到 b 子元素末尾，成为最后一个子元素 prependTo()

a.prependTo(b)

把 a 插到 b 所有子元素前面，成为第一个子元素

外部插入：

insertAfter()

a.insertAfter(b)

得到 ba

insertBefore()

a.insertBefore(b)

得到 ab

替换 :

replaceWith()

a.replaceWith(b)

用 b 替换掉 a

replaceAll()

a.replaceAll(b)

用 a 替换掉所有 b

删除：

remove()

a.remove();

删除 a 标签

empty()

a.empty();

清空 a 标签里的内容

6 、 CSS 样式操作。

addClass()

添加样式

removeClass()

删除样式

toggleClass()

有就删除，没有就添加样式。

offset()

获取和设置元素的坐标。

7 、 jQuery 动画

基本动画

show()

将隐藏的元素显示

hide()

将可见的元素隐藏。

toggle()

可见就隐藏，不可见就显示。

以上动画方法都可以添加参数。

1 、第一个参数是动画 执行的时长，以毫秒为单位

2 、第二个参数是动画的回调函数 ( 动画完成后自动调用的函数 )

淡入淡出动画

fadeIn()

淡入（慢慢可见）

fadeOut()

淡出（慢慢消失）

fadeTo()

在指定时长内慢慢的将透明度修改到指定的值。 0 透明， 1 完成可见， 0.5 半透明

fadeToggle()

淡入 / 淡出 切换

8 、 jQuery 事件操作

$( function(){} );

和

window.onload = function(){}

的区别？

他们分别是在什么时候触发？

1 、 jQuery 的页面加载完成之后是浏览器的内核解析完页面的标签创建好 DOM 对象之后就会马上执行。

2 、原生 js 的页面加载完成之后，除了要等浏览器内核解析完标签创建好 DOM 对象，还要等标签显示时需要的内容加载

完成。 他们触发的顺序？

1 、 jQuery 页面加载完成之后先执行

2 、原生 js 的页面加载完成之后

他们执行的次数？

1 、原生 js 的页面加载完成之后，只会执行最后一次的赋值函数。

2 、 jQuery 的页面加载完成之后是全部把注册的 function 函数，依次顺序全部执行。

jQuery 中其他的事件处理方法：

click()

它可以绑定单击事件，以及触发单击事件

mouseover()

鼠标移入事件

mouseout()

鼠标移出事件

bind()

可以给元素一次性绑定一个或多个事件。

one()

使用上跟 bind 一样。但是 one 方法绑定的事件只会响应一次。

unbind()

跟 bind 方法相反的操作，解除事件的绑定

live()

也是用来绑定事件。它可以用来绑定选择器匹配的所有元素的事件。哪怕这个元素是后面动态创建出

来的也有效

事件的冒泡

什么是事件的冒泡？

事件的冒泡是指，父子元素同时监听同一个事件。当触发子元素的事件的时候，同一个事件也被传递到了父元素的事件里去

响应。

那么如何阻止事件冒泡呢？

在子元素事件函数体内， return false; 可以阻止事件的冒泡传递。

javaScript 事件对象

事件对象，是封装有触发的事件信息的一个 javascript 对象。

我们重点关心的是怎么拿到这个 javascript 的事件对象。以及使用。

如何获取呢 javascript 事件对象呢？

在给元素绑定事件的时候，在事件的 function( event ) 参数列表中添加一个参数，这个参数名，我们习惯取名为 event 。

这个 event 就是 javascript 传递参事件处理函数的事件对象。