jQuery的操作2

一:jQuery操作属性(atrribute),它有四种类型:

1:操作单个属性atrr(name:value),如果这个属性已经存在,那它就是修改的意思,如果不存在,那它就是添加的意思。

2:操作多个属性,它传入的是个对象atrr({name:value,name:value。。。。。})

3:获取属性值,atrr(name),只要穿一个属性就可以,不需要传值,如果没有这个属性,那返回的是undefined。

4:移除属性:用法和获取属性一样,但是如果这里不传参数的,那就没有效果,一个都不移除,不是全都移除。

JQuery操作值,可以分为两部分:获取值和设置值。操作值我们用的是val()

1:获取值时不需要传入参数,它一般获取的都是表单的值

2:设置值时要输入一个value,注意:在select中设置时,如果和值有对应的option,那就那这个option被选中,如果没有对应的option,那select选中的是空白。

JQuery操作内容也和值一样可以分为获取内容和设置内容,但不同的是它每样都有两个方法,两个方法也是有区别的,分别是:

JQuery操作尺寸也是像上面一样分为获取和设置两部分。之前css()也是可以操作尺寸的。获取尺寸就不需要传参数,直接写height和width一个获取高度,一个获取宽度,而且获得是数值类型,不是字符串类型。

设置时需要传入参数,需要传入的也是数字类型:

Height()

Width()

Jquery操作坐标也是分为获取坐标和设置坐标。

获取坐标:有两种方法,offset和position,但两个是有区别的:

Offset:获取到的坐标是相对于页面的左上角而言,而且返回值也是一个对象{top:xx,left:xx}

Position:它是获得当前元素相对于有定位的父元素的坐标,如果父元素没有坐标,那它会一层层网上找,一直找到body为止。

设置坐标只有一种,position是不能设置坐标的。只有offset有,它需要传入是也是一个对象,需要注意的是,如果当前元素没有定位的话,它会默认给当前元素设置定位为relative。

JQuery操作滚动条,也是分为获取和设置。滚动的注册时间我们一般给document或window设置。

获取滚动条也是不需要传参数:

Scrolltop()是获得滚动条的纵向滚动值

Scrollleft()获得滚动条的横向滚动值

设置滚动条的滚动值,需要传入一个参数,是数值参数

JQuery的时间机制,它分为绑定时间机制和解绑事件机制。

绑定事件机制有四种:

1:之前常用的click(fn)。

2:bind(types,fn)。

3:delegate(selector,types,fn)

4:on(types,selector,data,fn)

这四种是有区别的,所以我们一般只会用到第四种。

第一种它不能绑定多个事件,只能绑定一个。

第二种它不能绑定动态创建出来的事件。

第三种是委托事件,它可以绑定动态创建的元素,也可以绑定多个事件。

第四也是委托事件,也可以绑定多个事件,可以绑定动态创建的元素,因为在jQuery后来的版本中on取代了第二和第三种,所以第二第三种都不用了。

事件委托的原理:(它其实就是冒泡原理)

On方法中如果没有第二个参数,那它就是给自身绑定事件,不存在委托事件。

接触绑定有三种,但两种一般也不用是unbind和undelegate,我们一般用off。它有三种用法。

1:Off()不传参数,就是解绑所有事件。

2:off(types)解绑指定类型的事件。自身和委托的事件都会被解绑。

3:off(types,“**”)解绑指定类型的委托事件,自身的保存下来不解绑。

触发事件:有三种方法触发。

1:直接调用:$().click

2:trigger(type)参数type就是要触发的事件的类型。

3:triggerHandler(type)参数type就是要触发的事件的类型,但是它有个好处是不会触发浏览器默认行为。

事件对象:

事件对象有很多,我们常用的以下几种:

其中event.data用法可以用个例子来解释更容易理解:

这里用e.data,最后输出的是我有100快,而如果把e.data换成money的话,那输出的会是我有0快。

event.stopPropagation() 阻止事件冒泡     event.preventDefault() 阻止浏览器默认行为       我们一般不用,我们而是用另一个return  false,它包含上面两个功能,简单粗暴。

时间: 2024-08-06 16:02:11

jQuery的操作2的相关文章

jQuery HTML 操作

jQuery 包含很多供改变和操作 HTML 的强大函数. 改变 HTML 内容 语法 $(selector).html(content) html() 函数改变所匹配的 HTML 元素的内容(innerHTML). 实例 $("p").html("W3C HTML"); 查看示例 添加 HTML 内容 语法 $(selector).append(content) append() 函数向所匹配的 HTML 元素内部追加内容. 语法 $(selector).prep

Jquery CSS 操作 - height() 方法

一.height() 方法 height() 方法返回或设置匹配元素的高度 $(".btn1").click(function(){ $("p").height(50); }); height方法事例 Jquery CSS 操作 - height() 方法,码迷,mamicode.com

jQuery 属性操作

方法 描述 addClass() 向匹配的元素添加指定的类名. attr() 设置或返回匹配元素的属性和值. hasClass() 检查匹配的元素是否拥有指定的类. html() 设置或返回匹配的元素集合中的 HTML 内容. removeAttr() 从所有匹配的元素中移除指定的属性. removeClass() 从所有匹配的元素中删除全部或者指定的类. toggleClass() 从匹配的元素中添加或删除一个类. val() 设置或返回匹配元素的值. 获得内容 - text().html()

深入学习jQuery节点操作

× 目录 [1]创建节点 [2]插入节点 [3]删除节点[4]复制节点[5]替换节点[6]包裹节点 前面的话 DOM节点操作包括创建节点.插入节点.移除节点.替换节点和复制节点.jQuery也有类似的方法,此外,还扩展了包裹节点.本文将详细介绍jQuery节点操作 创建节点 创建节点的流程比较简单,包括创建节点.添加属性和添加文本.若应用原生方法,一般地,包括document.createElement().setAttribute()和innerHTML var ele = document.

jQuery的操作

jQuery可以操作的样式可以分成两种css和class两种样式.css又可以分成三种:1:设置单个样式. 2:设置多个样式. 3:获取样式. class可以分成用法: 1:添加class样式. 2:移除class样式. 3:判断class样式. 4:切换class样式. jQuery操作也可以做动画,比较常用的有以下几种: 1:slideDown slideUp slideToggle slideDown(speed,callback) slideDown slideUp是滑入和滑出的意思,效

jQuery Ajax 操作函数

jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 描述 jQuery.ajax() 执行异步 HTTP (Ajax) 请求. .ajaxComplete() 当 Ajax 请求完成时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxError() 当 Ajax 请求完成且出现错误时注册要调用的处理程序.这是一个 Ajax 事件. .ajaxSend() 在 Ajax 请求发送之前显示

Jquery DOM 操作列表

jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). jQuery 属性操作方法 下面列出的这些方法获得或设置元素的 DOM 属性. 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). jQuery CSS 操作函数 下面列出的这些方法设置或返回元素的 CSS 相关属性.

jQuery CSS 操作

jQuery CSS 操作 jQuery 拥有三种用于 CSS 操作的重要函数: $(selector).css(name,value) $(selector).css({properties}) $(selector).css(name) CSS 操作实例 函数 css(name,value) 为所有匹配元素的给定 CSS 属性设置值: 实例 $(selector).css(name,value) $("p").css("background-color",&qu

jQuery DOM操作之结点转移复制

jQuery DOM操作之结点转移复制 $('div').append($('p'))这样即可把p标签移动到div标签里 $('div').append( $('p').html() )是把p标签里的内容复制到div标签里 $('div').append( $('p').clone(true))是复制一份到div标签里,原来的标签还保留着 $(function(){ $(".nm_ul li").click(function(){ //当clone参数设置为true时还可以将按钮上绑定

jQuery 常见操作实现方式

一篇 jQuery 常用方法及函数的文章留存备忘. jQuery 常见操作实现方式 $("标签名") //取html元素 document.getElementsByTagName("") $("#ID") //取单个控件document.getElementById("") $("div #ID") //取某个控件中 控件 $("#ID #ID") // 通过控件ID取其中的控件 $(