jqurey 学习过程

Jqurey学习

 

选择器 美元符号

 

$("p a");

即用美元符号来表示所选择的容器

功能符号的前缀

例如

var str=$.trim(string);\

window.onload dom只有被onload后才可以被选择

$document.ready(function(){})

简单的写法就是

$(function(){});

创建dom元素

var onewp=$("

这是啥

");

onewp.insertAfter("#mytarget");

在某个id前面则用#来添加

属性选择器

$(function(){

$("ul li ul li:has(a)").addClass("myClass");//ul下的li下的ul下的li的a元素添加一个class

})

 

需要学习各种jqury需要知道他的函数功能

 

位置选择器

$(function(){

$("p:lt(2)").addClass("myclass");

})

 

标记的属性

获取属性

var stitle=$("em:eq(1)").attr("title");获得em下的第二个em下的属性值title

$("span").text(stitle);将stitle赋予span标记

赋予属性

$("button:gt(0)").attr("disabled","disabled");//获取除了第一个button外的元素

元素的样式

$("div").addClass("myClass1 myClass");//添加css

$(function(){

  $("p"),click(function(){

    $(this).toggleClass("Classname");//有则添加这个class 没有则删除该class

  })

})

页面的元素

$(function(){

 var sString=$("p:first").text();// 获取文本方法

 $("p:last").html(sString);//获取页面上内容

});

克隆元素

$(function(){

  $("img:eq(0)").clone.appendTo($("p"));

  $("img:eq(1)").clone.appentTo($("p:eq(0)"));

})

jQuery处理事件

添加事件监听

 $(function(){//添加绑定事件

  $("img").bind("click",function(){$(#show).append("

点击事件1

")});

       .bind("click",function(){$(#show).append("

点击事件1

")});

       .bind("click",function(){$(#show).append("

点击事件1

")});

  $("input[type=button]").click(function(){

     $("img").unbind("click",functionname);//移除事件

   })

})

第十二课程 jQuery制动画与特效

元素的显示与隐藏

show()与hide()

show(num) //num显示所需要的时间

hide(num) 隐藏所需要的时间

fadeIn(num)//渐渐的出现 图片位置不变 出现

fadeOut(num)//渐渐的消失 图拍你位置不妙消失

幻灯片效果

slideUp() 拉出来效果

slideDown()

第十三课程 Jquery功能函数

$.each(object,function(){});//获取每个对象

$.grep(aArray,functio(value){return value>4})//数据过滤

$.map(aArray,fucntion(value,index){})//数据转化 index为序号 这里的$.map(aAarry,function(value){})}

第十四课程 jQuery 与Ajax

$("#target").load("14-1.jsp")//获取14-1.jsp中返回值

 

get post

 

$.get(url.[data],[callback])//callback回调函数

$.post(url,[data],[callback],[type])//callback回调函数

 

设置ajax的细节

 

$.ajax(options)

例如

$.ajax({

   type:"GET",

   url:"",

   data:creatQueryString(),

   success:function(data){

     $("id").html(decodeURI(data));

}

})

 

全局设置ajax

$.ajaxSetuo(options)

 

即和细节一样，就是全局设置统一后 在细节上少写一些代码

 

第15课 jQurey插件