文章标签 ‘jquery’
JQuery还给我们提供了更为方便的Ajax功能 $().load(url,data,callback) 将远程的数据插入至DOM中,url即请求的地址,data即发送的数据,数据类型json数据如{name:’张三’},callback即该方法完成后,调用的方法,即将远程数据载入DOM后调用的方法。注:这个方法默认是以get方式提交请求的,如果data有数据,则已post方式提交 例子: $.get(url,data,callback) get方式提交请求,参数意义同上 例子: $.post(url,data,callback,type) post方式提交请求,参数同上,不同的地方就是多了type参数,表示返回内容的格式(xml, html, script, json, text, _default) 例子: $.getJson(url,data,callback) get方式提交请求,同$.get方法,区别只是这个返回内容格式固定为Json格式 例子: $.getScript(url,callback) get提交请求,载入并执行一个JavaScript文件,参数url即请求的地址,callback即该方法完成后,调用的方法 例子:
JQuery有很强大的选择器的同时,还给我们提供了很多方便的方法。。。下面做介绍 attr(name) 获取元素中的属性的值,name属性名称 结果 123.jpg attr(name,value) 设置元素中的属性的值,name属性名称,value属性的值 结果 <img scr=’456.jpg’/> removeAttr(name) 移除元素中的属性,name属性名称 结果 <img/> addClass(name) 向指定元素添加css类名 结果 <img scr=’456.jpg’ class=’abcd’/> removeClass(name) 移除指定元素添加css类名 结果 <img src=’123.jpg’> togleClass(name) 切换指定元素的css类名,即如果存在css类名,则删除,如果不存在则添加css类名 结果 <img src=’123.jpg’> 结果 <img src=’123.jpg’ class=’abcd’> html() 获得指定元素的html内容,等效于.innerHTML 结果 <b>123</b> html(value) 设置指定元素的html内容,等效于.innerHTML=value 结果 <p>456</p> text() 获得指定元素的text内容 结果 123444 text(value) 等同于html(value) val() 获得指定元素value的值 结果 aaaa val(value) 设置指定元素value的值 结果 [...]
JQuery还有很多方法可以选择对象,继续介绍。。。 选择标签为li下所有class不等于horizontal的元素 选择标签为li下第二个元素(下标从0开始) 这个选择标签为tr的元素的奇数项 这个选择标签为tr的元素的偶数项 选择标签是th的所有父节点元素 JQuery还提供了很多选择器,这里不做介绍。。。 更多请查看API http://jquery-api-zh-cn.googlecode.com/svn/trunk/index.html
JQuery的核心功能,莫过于他的选择器了。。。实在是太方便了。。哈哈 下面做个介绍JQuery的基本选择器 用JQuery去选择这3个对象吧 简单吧。。。这样我们就选择了这三个元素,有人要问了,如果,页面中包含多个<p>或者class=’some-class’怎么办呢,没关系,默认他们就是一个集合的方式。 JQuery的选择器远不止这些 这样写就选择了Id=some-id下一级的所有li标签的元素 这样就选择了Id=some-id下一级为div,下一级所有li标签的元素,如果some-id下面有两个div怎么办呢?JQuery会选择所有div的下一级是li标签的元素 这个呢?很简单就是Id=some-id下所有class=child-class下所有标签为li的元素,是不是很强大呢? JQuery还有个”*”选择器,可以匹配所有目标 就是匹配id=some-id下所有元素下所有标签为li的元素
JQuery是现在流行的js框架,有很多有意思的功能方便我们使用,下面介绍基本使用方法 准备工作: 下载jquery的类库,http://docs.jquery.com/Downloading_jQuery这里可以找到,下载minified版本就够了,如果想研究jquery的核心代码可以下载Uncompressed,这个版本,准备工作已经完成,让我们快速感受jQuery魅力吧 使用: 新建一个html文档,加入jquery的类库,现在就可以用了 我们在body区插入下面代码 刷新页面,浏览器会自动弹出”Hello world!”; $(document).ready(function(){})这个方法就相当于window.onload=function(){} 后面会经常用到这个方法,下篇文章会介绍jQuery的选择器,这个可是jQuery的核心之一,jQuery对比其他js框架最强大的功能哦