JQuery总结

已于 2025-05-22 20:07:59 修改
阅读量903 收藏 10
点赞数 10
文章标签： javascript 开发语言 ecmascript
于 2025-05-22 19:37:57 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2503_90931806/article/details/148147885
版权

第一章：

A:JS的基本结构
 <script type="text/javascript">
        //JS代码
    </script>
B:引用JS的三种方式
1：行内
 <button type="button" onclick="javascript:alert('宝宝')">点一点</button>
2：内部
 <script type="text/javascript">
        //JS代码
    </script>
3：外部
<script src="外部JS的文件路径"></script>
C:JS的组成

EcmaScript(JS核心) ​ BOM(浏览器对象模型) ​ DOM(文档对象模型)

D:JS的组成成分
①：注释

单行注释 // ​ 多行注释 /* */

②：输出语句
文档输出：document.write("宝宝");
控制台输出：console.log("宝宝");
③：变量
1：声明变量且赋值(赋值时才知道类型)
 var num = 19;
 var name = "宝宝";
2：变量的数据类型

number(数值类型) ​ string(字符串类型) ​ boolean(布尔) ​ null(空值) ​ undefined(定义未赋值)

3：返回变量或者值的类型

typeof(变量或者值);

4：判断变量或者值是否是非数字

isNaN(变量或者值); //如果是非数字,返回true.

④：控制语句(和java一样)
 forEach(var temp in 数组){
        //temp 为下标
    }
⑤：运算符(和java一样)

==：只比较值内容 ​ ===：内容和类型都要相同

⑥：函数(自定义)
1：声明函数
    function 函数名(参数){
    }
    例如：
    //有参数的函数
    function f1(name){
        document.write(name);
    }
    //调用
    f1("宝宝");
    //有返回值的函数
    var name = function(){
        return "宝宝";
    }
    //调用
    document.write(name());
⑦：数组
1:定义数组
	var 数组名 = new Array(初始长度);
	var 数组名 = [1,2,3,4];
	var 数组名 = new Array(1,2,3,4);
例如：
	var nums = new Array(3);
	//赋值
	nums[0] = "茄子";
	nums[1] = "黄瓜";
	nums[2] = "藕";
2:数组的遍历
    for(var i=0;i<nums.length;i++){
		document.write(nums[i]);
	}
	// num  下标
	for(var num in nums){
		document.write(nums[num]);
	}

第二章：

A:函数(系统函数)
①将字符串转换为整数
    parseInt();
	parseInt("19.7abc");   //19
	parseInt("abc19.7");   //NaN
②将字符串转换为小数
	parseFloat();
③判断是否为非数字
	isNaN();
B:变量的作用域
①:全局变量：

定义在函数的外部

②:局部变量：

定义在函数的内部

③:隐式全局变量：

定义在函数的内部,没有使用var关键字定义

C:事件
    onclick:鼠标点击事件        ||      click
	onmouseover:鼠标移入事件    ||      mouseover
	onmouseout:鼠标移出事件     ||      mouseout
D:调试

1:进入浏览器,使用F12(或者Fn+F12)打开开发者模式. ​ 2:查看源代码,设置断点 ​ 3:刷新运行,使用F10逐步调试. ​ 4:查看变量变化.

第三章：

A:window对象
1：location

location.href = "设置路径";

2：history(历史路径的存储)
①向前
history.go(1);  <--> history.forward();
②向后
history.go(-1); <--> history.back();
B:window方法(五个常用)
    open();  //打开新窗体
	close(); //关闭
	alert(); //提示框
	prompt();  //输入框
	confirm();  //确认框
	setInterval();  //设置定时器(周期性)
	setTimeout();   //设置定时器(一次性)
C:document对象
1：根据ID获取节点(返回一个节点对象)
var el = document.getElementById("ID的名称");
2:根据标签名称(返回节点列表)
<p>kaikai</p>
var el = document.getElementsByTagName("标签名称");
3：根据属性名称(返回节点列表)
<p name="kaikai"></p>
var el = document.getElementsByName("name属性名称");
4:根据className来获取节点(返回节点列表)
<p class="kaikai"></p>
var el = document.getElementsByClassName("class属性名称");
D:定时函数
1：一次性(延迟指定时长--毫秒)
①设置定时器
var num = setTimeout("方法名称()",2000);
②关闭定时器
clearTimeout(num);
2：周期性
①设置定时器
var num = setInterval("方法名称()",2000);
②关闭定时器
clearInterval(num);
E:日期函数
1:定义日期函数()
    var date = new Date();  //获取当前时间(国际时间)
	//获取当前的年、月、日、时、分、秒
	var year = nowDate.getFullYear(); //获取年
	var mon = nowDate.getMonth()+1;  //获取月
	var date = nowDate.getDate();    //获取日
	var hour = nowDate.getHours();   //获取时
	var min = nowDate.getMinutes();  //获取分
	var se = nowDate.getSeconds();   //获取秒
F:数组(方法)

数组名.join('拼接符');--拼接 ​ 数组名.push('内容');--追加 ​ 数组名.sort();----排序 ​ PS： ​ 数组名.sort()--默认排序先排1开头的 ​ 数组名.sort(function(a,b){ ​ return a-b; //升序 ​ })

G:数学函数

ceil() 向上取整 ​ floor() 向下取整 ​ round() 四舍五入 ​ random() 随机数(0-1随机数)(*)

第四章(DOM文档对象模型)：

A:DOM分类

DOM core(DOM核心) ​ HTML-DOM ​ CSS-DOM

B:节点分类
①：节点属性

nodeType(1代表元素、3代表文本) ​ nodeName(节点名称) ​ nodeValue(主要针对表单元素多一点,value属性值)

②：获取节点
1：上一章学过的三种(略)
2：根据层次关系来访问节点(注意：文本节点的影响--空格)
	parentNode 		父节点
	firstChild 		第一个子节点
	lastChild  		最后一个子节点
	ChildNodes 		子节点
	previousSibling 上一个相邻节点
	nextSibling     下一个相邻
3：根据元素节点来访问节点
    parentElementNode 		父节点
	firstElementChild 		第一个子节点
	lastElementChild  		最后一个子节点
	ChildElementNodes 		子节点
	previousElementSibling 上一个相邻节点
	nextElementSibling     下一个相邻
③：获取节点文本、网页
    document.write(el.innerText);
	el.innerText = "宝宝";  //设置文本
	//网页(将标签认定为文本)
	document.write(el.innerHTML);			
	el.innerHTML = "<p>宝宝</p>";
C:设置样式
①：style(直接设置样式)
	<div id="myA">宝宝</div>
	//JS代码
	var el = document.getElementById("myA");
	el.style.color = "yellow";
	el.style.fontSize = "100px";
②：className(可以重复利用样式、提前准备样式)
//提前准备CSS样式	
	
    <style>
		.color{
			color:red;
			font-size:100px;
		}
	</style>
		<div id="myA">宝宝</div>
		//JS代码
		var el = document.getElementById("myA");
		el.className = "color";
D:获取样式
		<div id="myA">宝宝</div>
	①：第一种方式(针对行级元素)
		var color = document.getElementById("myA").style.backgroundColor;
		alert(color);
	②：第二种方式(针对IE6-8浏览器)
		var cartList = document.getElementById("myA");
		var color = document.defaultView.getComputedStyle(cartList, null).width;
		alert(color);
	③：第三种方式(针对IE浏览器)		
		var cartList = document.getElementById("myA");
		var color = cartList.currentStyle.width;
		alert(color);

第五章(DOM)：

A:获取节点
	/
/根据ID获取节点
	var el = document.getElementById("ID的名称");
	//根据标签名称获取节点(返回数组)
	var el = document.getElementsByTagName("标签名称");
	//根据属性名称获取节点(返回数组)
	var el = document.getElementsByName("属性名称");
	//根据类名获取节点(返回数组)
	var el = document.getElementsByClassName("类名");
B:操作节点
	//获取和设置节点属性
	var name = el.getAttribute("属性名称"); //获取属性
	el.setAttribute("属性名称","属性值");   //设置属性
	//创建节点(注意看JS、JQuery)(**)
	var el = document.createElement("节点名称");
	//插入节点
	选中节点.appendChild(el);  //将el节点插入到选中节点最后一个子节点
	父节点.insertBefore(节点A,节点B); //将节点A插到节点B前面
	//替换节点
	父节点.replaceChild(新节点,旧节点); //将新节点替换旧节点
	//删除节点
	父节点.removeChild(选中的子节点);
	//复制节点
	节点.cloneNode(true或者false);  //true代表复制子节点
 

第六章：
 

A:创建对象
 

内置对象(直接new出来) ​ 自定义对象
 

①基于Object方式来创建对象
 

    var obj = new Object();
	obj.name = "宝宝";  //属性
	obj.show = function(){
		console.log("执行方法");
	}
	//调用方法
	obj.show();
 

②基于字面量方式来创建对象
 

	var obj = {
		name:"宝宝",
		show:function(){
			console.log("执行方法");
		}
	}
	//调用方法
	obj.show();
 

B:简单工厂模式
 

	function createStu(name){
		var obj = new Object();
		obj.name = name;
		obj.show = function(){
			console.log("执行方法"+name);
		}
		return obj;
	}
	//使用工厂模式调用方法
	var stu1 = createStu("宝宝");
	stu1.show(); //调用方法
 

C:构造函数
 

function Student(name){ ​ this.name = name; ​ this.show = function(){ ​ console.log("执行方法"+name); ​ } ​ } ​ //调用方法 ​ var stu1 = new Student("打光棍"); ​ stu1.show();
 

D:原型对象(prototype)
 

function Student(){} ​ Student.prototype.name = "宝宝"; ​ Student.prototype.show = function(){ ​ console.log("执行方法"+name); ​ } ​ //调用方法 ​ var stu1 = new Student(); ​ stu1.show();
 

E：继承与借用构造函数
 

function People(name)｛ ​ this.name=name; ​ ｝ ​ funcation Child(){ ​ People.call(this); //借用构造函数(继承属性) ​ age:18; ​ } ​ Child.prototype=new PeoPle(); //继承方法 ​
 

第七章
 

A:let和const
 

let:
 

let命令的作用域只局限于当前代码块 ​ let命令声明的变量作用域不会被提前(暂时性死区) ​ 在相同作用域下不能声明相同的变量名
 

const：
 

用于声明一个只读常量,声明之后常用的值无法更改 ​ const命令的作用域只局限于当前代码块 ​ 注意:const声明对象时,对象不可更改,但是对象的属性可以更改
 

B:解构赋值
 

	let[a,b,c]=[1,2,3]   		//a=1,b=2,c=3
	
	结构嵌套赋值
	let [a,[b],c]=[1,[2],3]  	//a=1,b=2,c=3
	
	不完全解构
	let [a,b]=[1,2,3]			//a=1,b=2

	解构默认值
	let[a,b=5]=[1] 				//a=1,b=5;

	剩余运算符(只能放在最后)			
	let [a,...b]=[1,2,3,4,5]	//a=1,b=[2,3,4,5]
 

C:对象解构(查找属性名称)
 

let {a,b} = {a:"张三",b:"李四"};
let {a} = {c:"张三"};  //查找名称
 

D:函数默认值
 

function foo(x,y='world'){
		console.log(x,y);		
	}
	默认值参数要放到最后,设置了默认值参数,不能有同名变量
 

E:箭头函数
 

(如果方法体里面只有一条语句,{}可以省略)
let f1 = () => console.log("宝宝最帅");

let f2 = (x) => console.log("您的幸运数字为："+x);

let f2 = (x,y) => console.log("和为："+(x+y));

参数只有一个时,可以省略圆括号,没有参数时,不可省略圆括号	
 

第八章
 

A:模板字符串(``)反引号
 

let name = "Bob",time = "today";
document.write(`Hello ${name},how are you ${time}?`);
 

B:字符串拓展方法
 

	str.includes(需要查找的字符)
	str.startsWith(需要查找头部字符)
	str.endsWith(需要查找尾部字符)
	str.repeat(查找字符出现几次)
	str.padStart(总长度,补全字符串)  用于头部补全
	str.padEnd(总长度,补全字符串)    用于尾部补全
	str.trimLeft()  //去除左边空格
	str.trimRight() //去除右边空格
 

C:数组的扩展
 

1：拓展运算符...,可以将一个数组转化为用逗号分隔的序列
 

2：Array.from方法可以将类数组对象或可遍历的对象转换成一个真正的数组。
 

但是必须有length属性,而且属性必须为字符串数字
 

3：数组遍历的方法
 

keys()   		键名的遍历     
values() 		键值的遍历   
entries() 		键值对的遍历
<script>
	//定义数组
	var names = ["豆腐干","大猪蹄","螺蛳粉","羊肉串"];
	//遍历键  names.keys()===下标0,1,2,3
	for (var key of names.keys()) {
		console.log(key);
	}
	//遍历值  names.values()==="豆腐干"
	for (var value of names.values()) {
		console.log(value);
	}
	//遍历键值对
	for (var kv of names.entries()) {
		console.log(kv);
	}
</script>
 

D:对象拓展和遍历
 

1：对象复制、合并、解构赋值
 

<script>
	let a1 = {a:2};
	let b1 = {b:4};
	let c1 = {c:6};
	Object.assign(a1,b1,c1); //将b1c1对象加入到a1对象里面
	console.log(a1);
	
	let a2 = {a:2,b:9};
	let b2 = {b:14,c:67};
	let c2 = {c:98,d:89};
	Object.assign(a2,b2,c2); //将b2c2对象加入到a2对象里面
	//后面的重名的会覆盖前面重名的
	console.log(a2);
	//其他类型的值不在首参数
	const v1 = 'abc';
	const v2 = true;
	const v3 = 10;
	const obj = Object.assign({},v1,v2,v3);
	console.log(obj);
</script>
 

2：Object.is()和Object.assign()
 

<script>
    let num1 = +0;
    let num2 = -0;
    console.log(num1===num2);  //true
    console.log(Object.is(num1,num2)); //false
    //对象的合并
    let stu1 = {a:1};
    let stu2 = {b:2};
    let stu3 = {c:9};
    Object.assign(stu3,stu1,stu2);
    console.log(stu3);
    //如果有属性重名的情况(后来者居上)
    let stu4 = {a:7,b:8};
    let stu5 = {b:3,c:7};
    let stu6 = {c:8,d:3};
    Object.assign(stu6,stu4,stu5);
    console.log(stu6);
    const v1 = "你";
    const v2 = "好";
    const v = Object.assign({},v1,v2);
    console.log(v); //0,好
</script>
 

3：对象遍历
 

<script>
	//定义对象
	let stu = {name:"羊肉串",age:16,address:"湖南邵阳"};
	//遍历键(属性名称)--name、age、address
	console.log(Object.keys(stu)); //遍历对象的键
	//遍历值(属性值)--"螺蛳粉"、16、"湖南邵阳"
	console.log(Object.values(stu)); //遍历值
	//遍历键值对(名称-值)--name-"螺蛳粉",age-16,address-"湖南邵阳"
	console.log(Object.entries(stu)); //遍历键值对
	let xiaohei = {name:"小黑",color:"黑色",age:2};
	let xiaohuang = {name:"小黄",address:"湖南娄底"};
	//后面的覆盖前面的
	console.log(Object.assign(xiaohei,xiaohuang));
</script>
 

E:Set对象
 

<script>
	let nums1 = [1,2,3,4,5,2,3,4];
	let set1 = new Set(nums1);
	console.log(set1);  //自动去重
	
	let nums2 = [1,2,3,4];
	let nums3 = [2,3,4,5];
	let set2 = new Set([...nums2,...nums3]);
	console.log(set2);
	let set3 = new Set();
	set3.add(1);
	set3.add(2);
	set3.add(2);
	console.log("长度："+set3.size+",");
	console.log(set3);  //1,2
	set3.delete(1);  //删除指定元素
	console.log("查找是否有2"+set3.has(2));
	set3.clear(); //清空集合中所有的元素
	console.log(set3);
	let set4 = new Set(["大陈豪","小陈豪","李智宇"]);
	//遍历键
	for (let key of set4.keys()) {
		console.log(key);
	}
	//遍历值
	for (let value of set4.values()) {
		console.log(value);
	}
	//遍历键值对
	for (let kv of set4.entries()) {
		console.log(kv);
	}
</script>
 

 

F:Map对象
 

<script>
    //定义一个Map集合
    let map01 = new Map([
    ["name","宝宝"],["age",19]
    ]);
    console.log(map01.get("name"));
    console.log(map01.get("age")); 
//根据名称来获取值
    //定义Map集合
    let map02 = new Map();
    map02.set("湘","湖南");
    map02.set("豫","河南");
    map02.set("冀","河北"); 
    console.log(map02.get("湘"));
    //遍历键keys   forof
    for (let key of map02.keys()) {
    console.log(key);
    }
    //遍历值values
    for (let v of map02.values()) {
    console.log(v);
    }
    //遍历键值entries 
    for (let kv of map02.entries()) {
    console.log(kv);
    }
</script>	
 

第十章：
 

A:JQuery及优势
 

轻量级、强大的选择器、出色的浏览器兼容性 开源、完善的文档
 

B:JQuery工厂函数
 

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

C:JQuery选择器
 

①基本选择器
 

id选择器  	$("#id")
class		$(".class")
元素		$("标签")
*			$("*")
并集		$("a,b")
 

②层次选择器
 

	后代			$("div p")
	子代			$("div>p")
	相邻兄弟(之后)	$("div+p")
	同辈兄弟(之后)	$("div~p")
 

③过滤选择器(可能会考：表格的隔行变色**)
 

基本过滤选择器
 

	第一个		$("div:first")
	最后一个	$("div:last")
	取反		$("div:not(.p)")
	奇数		$("div:odd")         $("tr:odd").css()
	偶数		$("div:even")        $("tr:even").css()
	根据下标选择		$("div:eq(1)")
	根据下标选择大于	$("div:gt(1)")		
	根据下标选择小于	$("div:lt(1)")
 

属性选择器(*)
 

	[属性名称]				$("[name]")	
	[属性名称=属性值]		$("[name=uname]")
	[属性名称^=属性值开头]	$("[name^=u]")
	[属性名称$=属性值结尾]	$("[name$=e]")
	[属性名称*=属性值包含]	$("[name*=uname]")
	[属性名称!=属性值取反]	$("[name!=uname]")
 

D:JQuery让渡$符号
 

第一套：默认名称 jQuery
 

	jQuery.noConflict();  
	//工厂函数
	jQuery(function(){
		document.write("你好，我叫jQuery <br>");
	})	
 

第二套：自定义名称 $j
 

var $j = jQuery.noConflict();  
$j(function(){
document.write("你好，我叫$j");
})
 

第十一章：
 

A:DOM操作分为三类(*)
 

DOM-Core、HTML-DOM、CSS-DOM
 

B:节点操作
 

查找节点(略)
 

创建节点
 

var el = $("<p>肖军杰</p>");
 

插入节点(**)
 

插入内部(作为子节点)
 

父节点.append(el); //插入后面 ​ 父节点.prepend(el); //插入前面
 

插入外部(作为同辈节点)
 

节点.after(el); //插到后面 ​ 节点.before(el); //插到前面
 

删除节点
 

节点.remove(); //删除节点(不保留事件) ​ 节点.detach(); //删除节点(保留事件) ​ 节点.empty(); //清空节点
 

复制节点
 

节点.clone(true|false);
 

替换节点
 

$(A).replaceWith(B) 表示用B替换A ​ $(A).replaceAll(B) 表示用A替换B
 

C:属性操作
 

①获取和设置元素属性
 

var val = $("#myA").attr("src"); ​ $("#myA").attr("src","img/kaikai.jpg"); ​ $("#myA").attr({"src":"img/kaikai.jpg","alt":"凯凯"});
 

②删除元素属性
 

$("#myA").removeAttr("src");
 

D：节点遍历
 

①遍历子元素
 

节点.children();
 

②遍历同辈元素
 

节点.next() 相邻下一个 ​ 节点.prev() 相邻上一个 ​ 节点.slibings() 同辈兄弟(除自己)
 

③遍历前辈元素
 

节点.parent() 父级元素 ​ 节点.parents() 祖先级元素
 

④其他遍历方法
 

节点.each(function(index,element){});
 

E:内容操作
 

var html = 节点.html(); //可以识别html标签 ​ 节点.html("<p>凯凯</p>"); ​ var text = 节点.text(); //只识别文本 ​ 节点.text("凯凯");
 

F:获取和设置元素的value属性值可以使用val()方法
 

var value = 节点.val(); //获取value属性值 ​ 节点.val("凯凯"); //设置value属性值
 

G:设置和获取样式
 

节点.css("样式名称"); //获取样式 ​ 节点.css("样式名称","样式值"); ​ 节点.css({"样式名称1":"样式值1","样式名称2":"样式值2"});
 

H:追加和移除样式、切换与判断
 

①：追加样式(需要提前准备好css样式) ​ 节点.addClass("样式名称"); ​ ②：移除样式 ​ 节点.removeClass("样式名称"); ​ 节点.removeClass("样式名称1 样式名称2"); ​ ③：切换样式(结合了addClass和removeClass) ​ 节点.toggleClass(样式名称); ​ ④：判断样式 ​ 节点.hasClass("classname"); ​
 

第十二章：
 

A:基础事件
 

①：鼠标
 

click //鼠标单击事件 ​ dblclick //鼠标双击事件 ​ mouseover //鼠标移入事件 ​ mouseout //鼠标移出事件
 

②：键盘
 

keyDown //键盘按下 ​ keyPress //键盘按下未释放 ​ keyUp //键盘松开
 

③：表单事件
 

focus() //获取焦点 ​ blur() //失去焦点 ​ change() //文本发生改变 ​ submit() //表单提交
 

B:绑定和解绑事件
 

①：绑定事件
 

节点.on("事件类型","事件处理函数");
 

例如：
	// $("ul") 是  li的父级元素
	$("ul").on("mouseover","li",function(){
		$(this).css("background-color","red");
	});		
 

②：解绑事件
 

节点.off("事件类型");

//补充：如果不写事件类型、则移除全部事件
 

 

C:复合事件
 

①：hover(鼠标进入,鼠标出来)--相当于mouseenter()与mouseleave()的组合 ​ 节点.hover(function(){},function(){}); ​ ②：toggle()--不带参数(配合事件使用)--相当于show()和hide()的结合 ​ 节点.click(function(){ ​ 节点.toggle(); ​ });
 

D:动画
 

①显示和隐藏
 

节点.show("slow"); //单位：毫秒、显示 ​ 节点.hide(3000); //隐藏
 

②淡入和淡出
 

fadeIn(3000); //淡入(显示) ​ fadeOut(3000); //淡出(隐藏)
 

③上拉和下拉
 

slideUp(3000); //上拉(隐藏) ​ slideDown(3000); //下拉(显示)
 

​

                

        

    

  



    

      

        

            

              
                
                  曜008
                
              
            

            

                关注
              
            

        

        

          
      

      










                



	

		

			

				
					
jQuery总结

				
			

			

				

					weixin_44327380的博客
				

				

					10-15
					
					824
					
				

			

		

		

			
				
jQuery总结一、jQuery是什么？二、jQuery 核心函数三、jQuery 对象和 dom 对象区分四、jQuery 选择器1.基本选择器2.层级选择器3.过滤选择器五、jQuery 元素筛选

一、jQuery是什么？
jQuery，顾名思义，也就是 JavaScript 和查询（Query），它就是辅助 JavaScript 开发的 js 类库。
jQuery 核心思想！！！ 它的核心思想是 write less,do more(写得更少,做得更多)，所以它实现了很多浏览器的兼容问题。 jQue

			
		

	



                

            
              



	

		

			

				
					
jquery总结

				
			

			

				

					gronkie的博客
				

				

					12-05
					
					1121
					
				

			

		

		

			
				
选择器，获取和设置文本，获取和设置样式，关于class类名操作，动画，操作节点，获取和设置表单元素，设置和获取宽高，事件等等

			
		

	



              


  
              

                


	

		

			

				
					
仿写jQuery总结

				
			

			

				

					LWH8011的博客
				

				

					06-20
					
					2098
					
				

			

		

		

			
				
闭包
使用匿名函数||闭包 实现局部变量避免变量的全局污染
(function(){})()

window全局方法
window.$=window.jQuery

jQuery无new化操作
function jQuery(){
    return new jQuery.prototype.init()
}
jQuery.prototype.init=function(){
    return this;
}
jQuery.prototype.init.prototype = jQuery.proto

			
		

	





	

		

			

				
					
前端基础04 Jquery 总结

				
			

			

				

					Xs943的博客
				

				

					03-26
					
					2099
					
				

			

		

		

			
				
一、jquery
1.简介

A.就是对js的一个简单的封装 优化Html文档操作 事件处理 动画设计 ajax交互
B.适配了各种主流的浏览器
C.轻量级的前端框架
2.下载
官网下载地址：https://jquery.com/
二、引入jquery
1.1 step01 将jquery.js放入到js文件夹下

step03 新建html界面 引入js文件
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8

			
		

	



		

			
		



	

		

			

				
					
Bootstrap+jQuery总结

				
			

			

				

					Duktig的博客
				

				

					03-21
					
					3273
					
				

			

		

		

			
				
基础
jQuery基础

jQuery API 中文文档
jQuery API 3.3.1 速查表   （比较系统，好查询）
DOM的jquery操作（遍历）
使用注意事项


将其文件放在项目指定文件夹（一般在js文件夹下），然后像引用js文件那样引用它
必须放在所有自定义js文件之前


jQuery官网中可以下载大量的插件以方便使用（2000多个插件）


jacarousel插件（图片传送带，点击实现，不能自动轮播）
easyslide插件（图片轮播，不能点击）
facelist插件（输入关键字，显

			
		

	





	

		

			

				
					
jQuery学习总结3

				
			

			

				

					qq_63479468的博客
				

				

					03-25
					
					1330
					
				

			

		

		

			
				
一、jQuery事件机制

JavaScript中已经学习了事件，jQuery对JavaScript事件进行了封装，增加并扩展了事件处理机制。jQuery不仅提供了更加优雅的事件处理语法，而且极大地增强了事件的处理能力。

二、jQuery注册事件的发展历程

1.简单事件绑定 click()

不支持同时注册，也不支持动态注册。


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"&

			
		

	





	

		

			

				
					
JQuery总结2

				
			

			

				

					Emperorn的博客
				

				

					10-24
					
					704
					
				

			

		

		

			
				
/通过jquery对象来调用获取方法。// jQuery //他是核心的对象 里面的方法都是通过他来调用的。// 使用$来替代jQuery。

			
		

	





	

		

			

				
					
jQuery总结(思维导图+二维表+问题)

				
			

			

				

					2401_84246493的博客
				

				

					12-20
					
					1300
					
				

			

		

		

			
				
关于什么是jQuery：（下面是菜鸟里的介绍）jQuery 是一个 JavaScript 库。jQuery 极大地简化了 JavaScript 编程。jQuery 很容易学习。而jQuery对我的感受就是，链式运用的很形象，隐式迭代还有一些兼容性强的优点，由于上面说了jQuery是JavaScript的一个库，因此jQuery相对js来说，书写会更简单。因此jQuery可以更简单的操作DOM树。下面来看一看我的jQuery总结吧，主要是一些思维导图和二维表，还有一些我练习时出现的问题。

			
		

	





	

		

			

				
					
JQuery入门，JQuery总结

				
			

			

				

					01-05
				

			

		

		

			
				
**jQuery入门与总结**  jQuery是一个深受开发者喜爱的JavaScript库，它的出现极大地方便了JavaScript的编程，使得HTML元素的选择、操作和隐藏等任务变得更加简单。jQuery的核心理念是"write less, do more"，即用更...

			
		

	





	

		

			

				
					
jQuery总结1

				
			

			

				

					08-03
				

			

		

		

			
				
6、总结jQuery是一个强大的JavaScript库，它极大地简化了DOM操作、事件处理和动画制作。它的核心优势在于提高了开发效率，降低了代码复杂性，同时具有良好的浏览器兼容性。jQuery通过其独特的选择器语法，使得选取...

			
		

	





	

		

			

				
					
jquery总结学习资料JQuery总结

				
			

			

				

					10-16
				

			

		

		

			
				
**jQuery 总结**  在实际开发中，jQuery 可以极大地提高工作效率，减少代码量，使得动态交互和界面美化变得更加简单。然而，随着 ES6 和现代前端框架的崛起，如 React 和 Vue，jQuery 在某些场景下可能不再是首选。...

			
		

	





	

		

			

				
					
2022Jquery总结.pptx

				
			

			

				

					01-25
				

			

		

		

			
				
本文将深入探讨2022年jQuery的总结，包括其概念、优点、基本使用方法以及与DOM对象的区别。  首先，jQuery是由John Resig于2006年创立的，它是最受欢迎的JavaScript库之一。jQuery的设计理念是"write less, Do more...

			
		

	





	

		

			

				
					
网上体育商城的设计与实现（有商家端）（SpringBoot+Vue+MySQL）

				
			

			

				

					欧阳小白闯天涯
				

				

					05-20
					
					803
					
				

			

		

		

			
				
本文介绍了一个基于互联网的网上体育商城系统的设计与实现。该系统旨在解决传统实体店的地域限制和库存管理问题，为用户提供便捷的购物体验。系统分为前台和后台两部分，前台支持商品浏览、搜索、购买等功能，后台则提供商品管理、订单管理、用户管理等功能。系统采用SpringBoot、Vue.js和MySQL等技术栈，具备良好的扩展性和维护性。文章详细分析了系统的需求、功能模块、技术可行性、市场可行性、经济可行性和法律法规可行性，并提供了功能代码示例。通过该系统，用户可以高效完成购物任务，提升购物体验。

			
		

	





	

		

			

				
					
shader 圆形水波纹效果 threejs vue3

				
			

			

				

					m0_65915285的博客
				

				

					05-22
					
					137
					
				

			

		

		

			
				
【代码】shader 圆形水波纹效果 threejs vue3。

			
		

	





	

		

			

				
					
JavaScript对象继承 

				
			

			

				

					m0_63472757的博客
				

				

					05-23
					
					830
					
				

			

		

		

			
				
/ 子类通过原型链继承父类为了解决原型包含引用值导致的继承问题,一种叫作"盗用构造函数"的技术在开发社区流行起来(这种技术有时也称作"对象伪装"或"经典继承"). 基本思路很简单: 在子类构造函数中调用父类的构造函数 , 因为毕竟函数就是特定上下文中执行代码的简单对象,所以可以使用apply( )和call( )方法以新创建的对象为上下文执行构造函数,来看下面的例子://父类//子类//继承SuperType。

			
		

	





	

		

			

				
					
JavaScript进阶(十二)

					
最新发布

				
			

			

				

					weixin_52047874的博客
				

				

					05-23
					
					722
					
				

			

		

		

			
				
都可以改变函数 内部的this指向.call和apply会调用函数，并且改变函数内部this指向.call和apply传递的参数不一样，call 传递参数aru1，aru2..形式 apply 必须数组形式[arg]bind不会调用函数，可以改变函数内部this指向call调用函数并且可以传递参数apply经常跟数组有关系.比如借助于数学对象实现数组最大值最小值bind不调用函数，但是还想改变this指向.比如改变定时器内部的this指向.

			
		

	





	

		

			

				
					
vite学习笔记

				
			

			

				

					zxz86的博客
				

				

					05-23
					
					563
					
				

			

		

		

			
				
现代浏览器项目（Chrome >=61, Firefox >=60, Safari >=11）assetsInlineLimit: 4096,  // 4KB以下资源内联。框架新项目（Vue3/React18/Svelte）极速启动：冷启动时间比传统工具快 10-100 倍。闪电热更新：HMR 更新速度不受项目规模影响。智能构建：生产环境使用 Rollup 打包。库开发（利用 Rollup 的纯净打包）.scss/.less 直接导入。微前端子应用（快速加载需求）模拟 CommonJS。

			
		

	





	

		

			

				
					
"jQuery总结1：入门函数、优势及基本介绍

				
			

			

				

					
				

			

		

		

			
				
总结： 本文主要介绍了jQuery的...最后总结了本文的内容，再次强调了jQuery的优势，并鼓励读者继续深入学习和使用jQuery框架来提高开发效率。同时也提到了jQuery的开源特性，任何人都可以参与贡献代码或使用该框架。

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值