jQuery常用知识点总结以及平时封装常用函数

2020-05-27 18:10:05易采站长站整理

本文为大家介绍了jQuery中常用知识点及函数,包含许多细节方面的知识,下面我们一起学习一下。

jQuery中为我们提供了很多有用的属性,自己总结的一些常用的函数。个人认为在在线排盘开发中会比较常用的,仅供大家学习和参考。

刚开始学习前端的时候开始整理这个文档,现在内容已经逐渐增多。虽然现在看起来,文档里的内容非常简单,但是看着这些内容,好像还依稀记得这一行行代码当时被记录的情景。所以我想把这段回忆保存起来,为刚接触前端的童鞋们提供一个简单的查询的途径,也以此来缅怀我的前端学习之路。

** 此文档,我会持续更新 **
——————————————————————————–

jquery常用知识点

jquery效果

隐藏/显示:


hide/show(speed,callback); speed(空/slow/fast/毫秒)
$("#hide").click(function(){
$("p").hide();//隐藏 p标签;
$("p").show();//显示 p=标签;
});

淡入/淡出:


fadeIn/fadeout(speed,callback)
$(“#click”).click(function(){
$(“#div1”).fadeIn();//直接显示;
$(“#div2”).fadeIn(“slow”);//慢慢显示;
$(“#div3”).fadeIn(3000);//用3秒时间显示;
})

滑动:slideDown/slideUp(speed,callback)


$(“#click”).click(function(){
$(“#div1”).slideDown();//直接下滑;
$(“#div2”).slideDown(“slow”);//慢慢下滑;
$(“#div3”).slideDown (3000);//用3秒时间下滑;
})

动画:


$(".btn1").click(function(){
$("#box").animate({
height:"300px",
width:"300px"
}); //将宽高变为300px;
});

jQuery DOM

获取文本值、属性值:


<p id=”test”>这是一段文字中的<b>粗体</b></p>
<input id=”input” value=”文本值”/>
<a id=”a” href=”http://...”></a>

js代码:


$(“#test”).text();//输出“这是一段文字中的粗体”
$(“#test”).html();//输出“这是一段文字中的<b>粗体</b>”
$(“#input”).val();//输出“文本值”
$(“#a”).attr(“href”);//输出“http://...”, 获取元素属性值

设置文本属性值:

js代码: