视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
常用的jquery方法有哪些
2020-11-27 20:13:09 责编:小采
文档


fadeTo(speed,opcity)这个不常用,但是效果好。opcity取0~1之间的值
3.滑动 slideUp(),slideDown(),slideToggle()
4.动画 animate() $().animate(参数,speed,callback);
注:动画的属性名称必须使用marginLeft这种而不是margin-left
可以设置相对值。如:"left":"+=10px"
animate()可以设置队列动画,即动画的不同属性按顺序写,他就会按顺序执行
5.stop(stopAll,goToEnd)
 该方法在动画执行完之前就可以结束动画。适用于所有 jQuery 效果函数,包括滑动、淡入淡出和自定义动画。
 stopAll 参数规定是否应该清除动画队列。默认是 false,即仅停止活动的动画
 goToEnd 参数规定是否立即完成当前动画。默认是 false。

6.jquery 链

$("#p1").css("color","red")
 .slideUp(2000)
 .slideDown(2000);
jQuery 会抛掉多余的空格,并当成一行长代码来执行上面的代码行。

注:以上方法都拥有回调函数, callback如果是匿名函数可以立即执行,函数名是toggle完了执行

jquery HTML

返回内容

1.html(),text(),val()(这三种方法同样存在回调函数)
html或者text或者val(function(i,origvalue){})
回调函数有两个参数:被选元素列表中当前元素的下标,以及原始(旧的)值。
区别:html()可以返回标签结构,其他两个只返回文本
2.attr()和prop的区别 (这种方法同样存在回调函数)
我觉得attr用与获取和设置自定义的属性。prop用于获取标签固有的属性
attr(function(i,origvalue){})
3.添加文本append(),prepend()。before(),after()
前两个是在所选元素里面的前后添加
后两个是在所选元素的外部的前后添加
4.删除元素/内容 remove(),empty()
前者删除被选元素及其子元素
后者删除被选元素的子元素
5.操作css addClass(”class1,class2,,,”),removeClass(),css() 注:css方法和animate()方法不同,css方法属性使用的是margin-left而不是marginLeft
6.元素尺寸
width(),height(),innerWidth(),innerHeight(),outerWidth(),outHeight()
width(),height()==元素的宽高(不包括padding, margin,和border)
innerWidth(),innerHeight()==元素的宽高+padding(不包括margin和border)
outerWidth(),outHeight()==元素的宽高+padding+border(不包括margin)

jquery遍历

jquery遍历

1.父 parent(),parents(); 
2.子 children(),find() 
3.同胞 siblings(),pre(),next() 
4.过滤 first(),last(),eq(),filter(),not() 
 $(“p”).filter(“.url”);返回带有类名 “url” 的所有
元素: 
 $(“p”).not(“.url”);返回不带有类名 “url” 的所有
元素:
**

jquery Ajax

**

语法:$.ajax({name:value, name:value, … })
ajax异步请求的五个步骤
第一步:

var xmlhttp;if (window.XMLHttpRequest)
{ // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
 xmlhttp=new XMLHttpRequest();
}else{ // IE6, IE5 浏览器执行代码
 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

第二步:设置参数

url:”“, type:”“, success: ,error:等

第三四步:

xmlhttp.open(“GET”,”url”,true); 
 例如:”a.php?t=” +Math.random()” 
 xmlhttp.send();

第五步:

xmlhttp.onreadystatechange=function() { 
 if (xmlhttp.readyState==4 &&
xmlhttp.status==200) 
 { 
 document.getElementById(“myp”).innerHTML=xmlhttp.responseText; 
 } }

get和post不一样: get是提交到地址栏。post是提交到后台php页面。 所以若是get方法,url请这样写:例如:”a.php?name=zhangsan&age=14”

最后再来处理服务器给我们返回的数据

xmlhttp.responseText; 获得字符串形式的响应数据。 xmlhttp.responseXML; 
获得 XML形式的响应数据。

ajax处理php/xml/jsp等文件是一样的。主要看返回的数据是什么样子的,然后进行相应的处理


由于许多的js框架都在使用$作为简写的符号。如果使用多个框架将会使得jquery停止运行

解决办法:jQuery noConflict() 方法

1.创建自己的表示符号代替$

var jq = $.noConflict();
jq(document).ready(function(){
 jq("button").click(function(){
 jq("p").text("jQuery 仍然在工作!");
 });
});

2.在外边使用jQuery表示,里边用$

$.noConflict();
jQuery(document).ready(function($){
 $("button").click(function(){
 $("p").text("jQuery 仍然在工作!");
 });
});

jquery JSONP

利用script标签的src属性没有域名的特点;

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>JSONP 实例</title>
 <script src="http://cdn.static.runoob.com/libs/jquery/1.8.3/jquery.js"></script> </head><body><p id="box"></p><script>$.getJSON("http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=?", function(data) {
 //data就是服务器返回给我们的数据,我们只需要对他进行处理即可
 var html = '<ul>'; 
 for(var i = 0; i < data.length; i++)
 {
 html += '<li>' + data[i] + '</li>';
 }
 html += '</ul>';

 $('#box').html(html); 
});
</script>
</body>
</html>

下载本文
显示全文
专题