Jquery自学笔记
Jquery自学笔记
惟爱你 发表于3年前
Jquery自学笔记
  • 发表于 3年前
  • 阅读 36
  • 收藏 0
  • 点赞 0
  • 评论 0

腾讯云 十分钟定制你的第一个小程序>>>   

Jquery自学笔记

                                                                            

第一章 Jquery介绍

获取输入框内容

1、获取输入值:

第一种:

F:\12.Javascript学习之路\Jquery学习\demo01.html

 

第二种:

F:\12.Javascript学习之路\Jquery学习\demo02.html

 

第三种:

F:\12.Javascript学习之路\Jquery学习\demo03.html

 

第四种:

F:\12.Javascript学习之路\Jquery学习\demo04.html

 

 

添加样式

1、为有id的添加css,例如:

2. 移除CSS

 

3、添加CSS

 

第二章 Jquery选择器

参考书籍:F:\4.文档书籍\ jQuery1.10.3_20131214.chm

第一节、Jquery选择器介绍

第二节、基本选择器

ID选择器:$("#a1").css("background-color","red");

Class选择器:$(".c1").css("background-color","red");

标签选择器:$("a").css("background-color","red");

F:\12.Javascript学习之路\Jquery学习\demo05.html

 

第一节、属性选择器

$("[href]").css("background-color","red");

         $("[href='#']").css("background-color","red");

         $("[href$='com']").css("background-color","red");

                  

        

         F:\12.Javascript学习之路\Jquery学习\demo05.html

 

第一节、其他选择器

         $("p.c1").css("background-color","red");

         $("ulli:first").css("background-color","red");

         $("ulli:last").css("background-color","red");

 

F:\12.Javascript学习之路\Jquery学习\demo05.html

 

第三章 Jquery操作Dom

第一节:Jquery操作DOM节点

1,  查找节点

var li2 =$("ul li:eq(1)");  //变成Jquery对象

 

2,  创建节点 append()

var li3 = $("<li title='这是易明'>易明</li>");//创建Jquey对象

var li4 = $("<li title='这是XiaoMAo'>Xiaomaoguai</li>");

$("ul").append(li3);              //加到无序列表最后面

li4.insertAfter($("ulli:eq(0)"));     //插入到一个Jquery对象之后

3,删除节点 remove()

第二节:Jquery操作DOM节点属性

1,查找属性

语法:Jquery对象.attr(属性名称);

alert($("ulli:eq(1)").attr("title"));

3,  设置属性

语法:Jquery对象.attr(属性名称,属性内容);

$("ul li:eq(1)").attr("title","你懂得");

4,  删除属性

语法:Jquery对象.removeAttr(属性名称);

第三节:Jquery操作DOM节点样式

1,  获取样式

语法:类似属性 :Jquery对象.attr(“class”)

$(“ul li:eq(1)”).attr(“class”);

2,  设置样式

语法:Jquery对象.attr(“class”,样式)

3,  追加样式

$("ulli:eq(0)").attr("class","lc2");  //添加样式

$("ulli:eq(1)").addClass("lc3");  //追加,可以有多个样式

4,  移除样式

$("ul li:eq(1)").removeAttr("class");//方法一 :移除所有的样式

$("ul li:eq(1)").removeClass("lc");//方法二:移除指定样式

 

F:\12.Javascript学习之路\Jquery学习\demo07.html

 

第四节:设置和获取HTML,文本和值

1,获取 html,设置 html

 

 

2,获取文本,设置文本

 

 

3,获取值,设置值

 

 

第五节:遍历节点操作

1,获取所有子节点 children()

2,获取邻近的下一个兄弟节点 next()

3,获取邻近的上一个兄弟节点 prev()

 

第六节:Jquery操作DOM节点CSS

1,获取 DOM 节点 CSS 样式

5,  设置 DOM 节点 CSS 样式

 

 

 

 

第四章 Jquery事件操作

第一节:文档加载事件

$(function(){});

$(document).ready(function(){});

第二节:DOM单击、双击事件

第三节:DOM获得焦点、失去焦点事件

第四节:DOM鼠标移入,移出事件

第五章 Jquery动画效果

第一节:Jquery隐藏与显示DOM

 

第二节:Jquery淡入和淡出DOM

 

第三节:Jquery滑动DOM

 

第四节:Jquery动画

 

第五节:Jquery callBack回调方法

 

第六节:Jquery暂停动画

 

 

 

第六章 Jquery Ajax

第一节:Jquery Ajax简介

Jquery Ajax 操作封装了一套跨浏览器,方便用户使用的 Api

第二节:Jquery Ajax Load方法

远程请求,把请求的数据载入到 DOM 里;

load( url , [,data] , [,callback])

Url:请求地址

Data:请求参数

Callback:请求完成后的回调方法

 

第三节:jquery Ajax Get/Post方法

 

Ajax 请求后台;

$.post(URL,data,callback);

Url:请求地址

Data:请求参数

Callback:请求完成后的回调方法



来自为知笔记(Wiz)



共有 人打赏支持
粉丝 0
博文 29
码字总数 28833
×
惟爱你
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: