jQuery

最新推荐文章于 2023-10-31 22:58:38 发布
最新推荐文章于 2023-10-31 22:58:38 发布
阅读量299 收藏
点赞数
分类专栏： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/whatname123/article/details/116332421
版权

什么是jQuery

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作（DOM）、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为：具有独特的链式语法和短小清晰的多功能接口；具有高效灵活的css选择器，并且可对CSS选择器进行扩展；拥有便捷的插件扩展机制和丰富的插件。

总结：一个快速、简洁的js框架，倡导用更少的代码做更多的事情，优化了HTML文档操作、事件处理、动画设计和Ajax交互！

一个前端框架，对javaScript的升级版

jQuery版本

带min的 是 压缩版本，在我们开发中，其实使用哪一个都可以，因为核心功能都是通用的！

压缩版本的优势：
(1)内存占用率小，所以项目线上运行使用的技术版本都是压缩版本
(2)因为其进行了压缩，隐藏了好多js实现的细节，更加安全

jQuery文件的引入

想要书写jQuery语法的脚本，那么必须导入相关的jQuery文件，否则所有的jQuery关键字都不识别，直接报错！
因为jQuery是js的升级版，所以和js一样用<script>标签引入

<script type="text/javascript" src="js/jquery-3.4.1.js"></script>

jQuery的核心对象

$jQuery的核心对象就是$，等价于jQuery。
$核心对象到底是什么？万能方法，支持传递各种类型的选择器，来获取到对应的jQuery标签对象！

<script type="text/javascript">
	//jQuery方法改变div中文本内容颜色
	$("#div1").css("color","yellow");
	jQuery("#div2").css("color","yellow")
</script>

jQuery中的文档加载

  1. ready()：jQuery提供的函数，用于页面加载成功后执行。
    onload : js中的事件, 表示html页面加载完毕后, 再执行指定内容。
  2. jQuery加载页面的写法:
//第一种写法:
$(document).ready(function(){
     //功能行为;
})
//第二种方式:
 $(function(){
     //功能行为;
})
  1. onload 与ready有什么区别？
    (1) jQuery中文档加载的方式有两种，而js中只有一种！
    (2) js中的window.onload只能执行一次，书写多遍，也只执行一次(后覆盖前，后面生效)！但是jQuery中文档加载的方式可以执行多次！
    (3) onload必须等到页面内所有元素都加载完毕后才能执行。jQuery中的方式，只需要等到HTML的DOM结构加载完毕时就可以执行。
    即：ready()比onload早

但是，在测试时经常会出现onload早的现想，为什么呢？
因为页面中图片、视频文件加载几乎没有，而onload和ready是多线程的，这是两个时间上几乎没有差别，甚至会出现onload比ready早的现象。但是理论上ready要比onload要早。

js对象与jQuery对象的转换

(1) jQuery对象，$(“选择器”)，不管传递什么类型的选择器，得到的都是集合！
(2) jQuery对象 ==> js对象

<script type="text/javascript">
	$("#div1")[0].setAttribute("align","right");
	$("#div2").get(0).setAttribute("align","right");
</script>

(3) js对象 ==> jQuery对象

<script type="text/javascript">
	var a = document.getElementById("div1")
	$(a).css("background-color","blue");
</script>

(4) jQuery对象虽然是个集合，但是可以操作这个整体！
ps:内置了隐式循环，本质上还是在操作单个元素，只不过这个过程给我们自动封装完毕了。

jQuery选择器

基本选择器

  1. 标签选择器: $("标签名")
  2. id选择器: $(“#id属性值”)
  3. 类class选择器: $(“.class属性值”)
  4. *通配选择器 : $(“*”) 表示匹配所有标签

层级选择器

  1. 后代选择器 parent child，使用空格隔开。获取到父级元素下所有的child(祖孙关系)
  2. 子代选择器 parent > child，用>隔开。获取到父级下的子元素(父子关系)
  3. 相邻兄弟选择器 prev +next，使用+隔开，获取到prev元素同级以下紧挨着的next元素(兄弟关系) 同级以上不选择
  4. 一般兄弟选择器 prev ~
    next，使用~隔开，获取到prev元素同级以下所有的next元素(兄弟关系) 同级以上不选择
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>层级选择器</title>
	</head>
	<body>
		<p>与外层div同级别0</p>
		<div id="out">
			<p>段落1</p>
			<div>
				<p>内部段落2</p>
			</div>
			<div>
				<p>内部段落3</p>
			</div>
		</div>
		<p>与外层div同级别1</p>
		<p>与外层div同级别2</p>
		<p>与外层div同级别3</p>
		<p>与外层div同级别4</p>
		<p>与外层div同级别5</p>
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js">
	</script>
	<script type="text/javascript">
		// 后代选择器 : parent child，使用空格隔开。获取到父级元素下所有的child(儿子、孙子、曾孙子、...)(祖孙关系)
		$("#out p").css("color","red");
		
		// 子代选择器 : 用>隔开。获取到父级下的子元素(儿子)(父子关系)
		$("#out>p").css("background-color","yellow");
		
		// 相邻兄弟 : prev+next，获取到prev元素同级以下紧挨着的next元素(兄弟关系)
		$("#out+p").css("font-size","40px");
		
		// 一般兄弟 : prev ~ next，使用~隔开，获取到prev元素同级以下所有的next元素(兄弟关系)
		$("#out~p").css("font-weight","bold");
	</script>
</html>

过滤选择器

:first 第一个
:last 最后一个
:eq(下标) 指定索引下的
:gt(下标)  大于指定索引下的所有
:lt(下标) 小于指定索引下的所有
:odd 奇数下标下的所以  奇偶指的是下标！！！下标从0开始
:even 偶数下标下的所有
:not(选择器) 除去括号内的

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>过滤选择器</title>
	</head>
	<body>
		<div>1</div>
		<div class="div2">2</div>
		<div>3</div>
		<div class="div2">4</div>
		<div>5</div>
		<div>6</div>
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js">
	</script>
	<script type="text/javascript">
		// : first : 第一个
		$("div:first").css("color","red");
		// :last 最后一个
		$("div:last").css("color","red");
		// :eq(下标)
		$("div:eq(3)").css("color","red");
		// 坐标从0开始
		// :odd  奇数下标  
		// :even 偶数下标 
		$("div:odd").css("background-color","yellow");
		$("div:even").css("font-size","40px");
		
		// :gt(下标) : 大于参数下标
		$("div:gt(2)").css("padding-left","50px");
		
		// : lt(下标) : 小于参数下标
		$("div:lt(2)").css("padding-left","100px");
		
		// : not(选择器) 排除掉参数选择器之外的其他标签
		$("div:not(.div2)").css("background-color","blue");
	</script>
</html>

属性选择器

根据属性值的内容组成及特点来进行筛选，很少使用
[属性名] 找到所有添加了此属性的标签
[属性名=值] 找到所有添加了此属性并且是这个值的标签
[属性名!=值] 没有指定属性名的或者属性名不等于指定值的
[属性名^=值] 找到所有添加了此属性并且以这个值开头的标签
[属性名$=值] 找到所有添加了此属性并且以这个值结尾的标签
[属性名*=值] 找到所有添加了此属性并且包含这个值的标签

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>属性选择器</title>
	</head>
	<body>
		<div class="div1">1</div>
		<div class="div1">2</div>
		<div class="iv3">3</div>
		<div class="v5">4</div>
		<div class="ccc">5</div>
		<div>6</div>
		<div>7</div>
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js">
	</script>
	<script type="text/javascript">
		// [属性名] 找到所有添加了此属性的标签
		$("div[class]").css("color","red");
		// [属性名=值] 找到所有添加了此属性的标签
		$("div[class=div1]").css("background-color","yellow");
		// [属性名!=值] 没有指定属性名的或者属性名不等于指定值的
		$("div[class!=div1]").css("font-size","40px");
		// [属性名^=值] 包含指定的属性, 并且以值为开头
		$("div[class^=c]").css("background-color","blue");
		// [属性名$=值] 包含指定的属性, 并且以值为结尾
		$("div[class$=3]").css("font-weight","bold");
		// [属性名*=值]  包含指定的属性, 并且属性值中包含等号右边的值
        $("div[class*=v]").css("padding-left","50px");
		
	</script>
</html>

表单选择器

基本表单选择器、表单过滤选择器！

基本表单选择器：
:input 单独的:input表示获取到表单中所有可输入元素 select和textarea也算
:text 所有类型为text的input元素
:password
:checkbox
:radio
...
表单过滤选择器：
input:checked 选择被选中的单选框或者复选框
option:selected 选择被选中的option下拉选项
:enabled 选择可用的表单元素
:disabled 选择禁用的表单元素

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>表单选择器</title>
	</head>
	<body>
		<form action="01_label1.html" method="post">
			姓名 : <input type="text" name="uname" disabled="disabled"/><br />
			密码 : <input type="password" name="pass" placeholder="请输入密码"/><br />
			性别 : <input type="radio" name="sex" value="男" checked="checked"/>男 
			      <input type="radio" name="sex" value="女"/>女<br />
			爱好: <input type="checkbox" name="hobby" value="唱歌"/>唱歌
			      <input type="checkbox" name="hobby" value="跳舞" checked="checked"/>跳舞
			      <input type="checkbox" name="hobby" value="rap"/>rap
			      <input type="checkbox" name="hobby" value="打篮球"/>打篮球<br />
			文件 : <input type="file" name="file"/><br />
			生日: <input type="date" name="bir"/><br />
			学历 : <select name="degree">
				       <option value="研究生">研究生</option>
				       <option value="本科" selected="selected">本科</option>
				       <option value="幼儿园">幼儿园</option>
			      </select><br />
			个人简介:
			      <textarea name="tex" rows="30" cols="35">请阅读以下协议:</textarea><br />
			<input type="submit"/> <input type="reset"/>
		</form>
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
	<script type="text/javascript">
		// :input 表示获取到表单中所有可输入元素标签 select和textarea也算
		console.log($(":input").length);// 14
		// :password : 表示筛选出所有type属性为password输入框
		console.log($("input:password").css("border","2px blue solid"));
		
		// 	input:checked 选择被选中的单选框或者复选框
		//	option:selected 选择被选中的option下拉选项
		//   :enabled 选择可用的表单元素
		//	:disabled 选择禁用的表单元素
		console.log($("input:checked"));
		
		console.log($("option:selected").val());// 本科
		
		console.log($("input:disabled").length);
		console.log($("input:enabled").length);
	</script>
</html>

在这里插入图片描述
在这里插入图片描述
特殊选择器this

this是原生js中的关键字，表示自身对象！！！
在jQuery中自身对象的表示形式为$(this)
this存在于方法中，代表此方法的调用者！

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>this特殊选择器</title>
	</head>
	<body>
		<div id="div1">BLOCK1</div>
		<div id="div2">BLOCK2</div>
		
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
	<script type="text/javascript">
		var div1 = document.getElementById("div1");
		div1.onclick = function(){
   			//此时this相当于div1
            this.style.color = "red";
		}

		$("#div2").click(function(){
			//此时$(this)相当于$("div")
			$(this).css("color","red");
		});		
	</script>
</html>

jQuery事件绑定

jQuery中的事件与javaScript中的事件类似，只是事件名不再以on开头，在javaScript事件名的基础上去掉on就是jQuery事件。
给页面中的某个标签绑定事件，首先需要通过jQuery选择器获取到该元素，然后通过.给该元素绑定不同类型的jQuery事件方法，方法内部是通过事件函数来完成具体的功能。

基本语法：
$(“选择器”).事件方法名(function(){
函数体；
});
例如，我们我要给一个id为btn的按钮绑定一个单击事件，则写法如下：

$(“#btn”).click(function(){ 函数体 });

js中的事件与jQuery中事件比较:

  1. jQuery中事件名称就是js中事件名称去掉on
  2. 语法结构上略微不同
js对象.事件名 = function(){
  // 事件行为动作
}
jQuery对象.事件名( function(){
   // 事件行为动作
})

在这里插入图片描述

jQuery动画效果

jQuery中提供了许多设计好、内置的动画方法，每一个动画方法实现动画的方式不一致！

常见的动画效果有三组：

下面几个动画方法，参数都是通用的：
参数1：动画的执行时间，这个必须设置，如果不设置，没有动画效果！
时间取值，可以是具体的毫秒值，也可以使用固定的英文单词fast、slow
参数2：动画的回调函数callback，当动画完成时，执行的方法

举例 :

jQuery对象.show(1000,function(){
    jQuery对象显示需要1000毫秒才能完全展示出来;
    第二个参数,当标签已经完全展现之后, 可以调用一个函数,就是function; 
    第二个参数可以不存在
});

第一组：
show() hide() toggle()
实现显示与隐藏, toggle表示取反
通过改变标签的width、height、opacity不透明度来实现的！

第二组：
fadeIn() fadeOut() fadeToggle()
实现淡入淡出, toggle表示取反
通过改变不透明度opacity来实现动画效果的！

第三组：slideDown() slideUp() slideToggle()
下拉显示、上卷隐藏、取反
通过改变height高度来实现动画效果的！

案例效果: div块的展示, 消失, 和切换都需要2秒钟动画完成

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>jQuery中动画效果</title>
		<style type="text/css">
			div{
				width:300px;
				height:300px;
				background-color: red;
			}
		</style>
	</head>
	<body>
		<input type="button" value="show"/>
		<input type="button" value="hide"/>
		<input type="button" value="toggle"/>
		<div></div>
	</body>
	<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
	<script type="text/javascript">
		$("input:first").click(function(){
			// 下拉显示
			$("div").slideDown(2000,function(){
				console.log("div展示完毕");
			})
		})
		$("input:eq(1)").click(function(){
			// 上拉隐藏
			$("div").slideUp(2000);
		})
		$("input:last").click(function(){
			// 取反
			$("div").slideToggle(2000);
		})
	</script>
</html>

jQuery操作标签的css样式

  1. jQuery改变标签css样式的方式：
    使用css方法改变一个css样式 : css("css属性名称", "值");
    而且css属性名称与最原始的css属性名一致，与js中的属性名要区分！
    使用css方法同时改变多个css样式

    css({
	"css属性名称": "值",
	"css属性名称": "值",
	"css属性名称": "值"
});

  2. addClass() removeClass() toggleClass()
    这三个方法是通过操作标签的类名来完成样式的添加与移除的！
    addClass(“类名1 类名2 ...”) 为标签添加类名，多个类名使用空格隔开
    removeClass(“类名1 类名2 ...”) 移除标签的类名，多个类名使用空格隔开
    toggleClass(“类名1 类名2 ...”)切换类名，有则移除、没有则添加！

$("div").css("color","red");
$("div").css({
	"width":"300px",
	"height":"300px",
	"background-color":"yellow"
});
$("div").addClass("font fontWeight");
$("div").removeClass("font");
$("div").toggleClass("font fontWeight");

jQuery操作标签的行间属性

  1. 原生js中操作行间属性:

    js对象.行间属性名 = “值”
js对象.setAttribute(“行间属性名”, “行间属性值”);

  2. jQuery中操作标签行间属性的方法：
    attr()
    attr(“行间属性名”) ==> 获取行间属性的值
    attr(“行间属性名”, “值”) ==> 为行间属性赋值或者修改值
    prop()
    prop(“行间属性名”) ==> 获取行间属性的值
    prop(“行间属性名”, “值”) ==> 为行间属性赋值或者修改值

以上两个方法的区别主要在于，操作的行间属性是否是固有属性，也就是是否是标签固有的属性！
注意 : 举例,表单元素input有一个行间属性value，表示表单元素的值！div没有value属性！操作标签自带的属性使用prop()方法，而操作自定义的属性通常使用attr()！
在jQuery1.5的版本后，已经不再对attr()方法进行维护，现在都是使用prop()进行行间属性的操作！

jQuery中的DOM操作

页面内容的增删改查

添加

内部添加
A.append(B) 表示将b标签添加到A标签内部的最后
A.prepend(B) 表示将b标签添加到A标签内部的最前面
同级添加
A.after(B) 表示将b标签添加到A标签的同级以下紧挨着的位置
A.before(B) 表示将b标签添加到A标签的同级以上紧挨着的位置

var $font = $("<font>我后添加到页面上,使用jQuery形式添加</font>");
$("div").append($font);
$("div").prepend($("<a href='http://www.baidu.com' target='_blank'>百度</a>"))

删除

empty()
严格意义上来说，empty()是清空操作，只把标签内部所有的内容删除，但是标签本身得到了保留
remove()
将标签本身及标签内部所有的内容都删除
支持传递筛选的选择器，选择性的删除内容 remove(“选择器”)

$("div").empty(); // 清空div中所有内容
$("div").remove(); // 删除div标签以及其内部所有内容
$("div font").remove(); // 删除div中的所有font后代标签
$("div font").remove("#fo"); // 删除div中id为fo的后代标签

查询

$(“选择器”)

修改

  1. 修改css样式
    js：js对象.style.css样式名称 = “值”;
    jQuery：css({“属性名”:”属性值”…})
    addClass() removeClass() toggleClass()
  2. 行间属性
    js： js对象.行间属性
           js对象.setAttribute(“属性名”,”属性值”)
    jQuery：prop(“属性名”,”属性值”)
  3. 修改标签内容
    js：
    普通标签 innerText innerHTML
    表单元素 value属性值
    jQuery:
    普通标签: text() 函数, html()函数
    text()只能解析纯文本
    html()除了解析纯文本，还可以解析html结构
    表单元素 val()

jQuery的遍历

jQuery对象集合.each(function(index, ele) {
遍历的代码
})
$.each(jQuery对象集合, function(index, ele) {
遍历的代码
})

给参数有2种情况
两个参数:第一个是下标,第二个是遍历到的对象(js对象)
一个参数:代表下标
jQuery对象集合：比如$(数组)

jQuery表单校验插件(了解)

表单校验主要去进行数据合理性的校验。
比如：
非空、长度、内容组成、一致等！

针对表单校验的问题，jQuery提供了一个插件，叫做validation，这个插件内置了许多默认的校验规则，我们针对某些常见的或者通用的校验内容，可以直接给定其提供的校验规则，而不需要再书写额外的校验代码，提高了开发效率！

  1. 导入表单校验插件需要的js文件
    必须先导入jQuery文件，因为校验插件的语法就是jQuery语法！validate.js就是核心的表单校验脚本，messages_zh.js就是语言脚本，默认校验提示信息为英文，只有导入了语言脚本，才能显示中文信息！

    <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript" src="js/messages_zh.js"></script>

  2. 使用校验插件，完成表单的校验。
    校验插件中提供的默认的校验规则：
    在这里插入图片描述

  3. jQuery表单对象调用 validate方法，使校验规则生效

    $("form").validate();

使用方法一：书写在行间属性上

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>jQuery中的对于表单验证的插件使用</title>		
		<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
		<script type="text/javascript" src="js/jquery.validate.js"></script>
		<script type="text/javascript" src="js/messages_zh.js"></script>
		<script type="text/javascript">
			onload = function(){
				$("form").validate();
			}
		</script>
	</head>
	<body>
		<form action="" method="get">
			用户名：<input type="text" name="username" id="username" required="true" rangelength = "[5,15]"/><br />
			密码：<input type="password" name="password" id="password" required="true" rangelength = "[3,6]"/><br />
			确认密码：<input type="password" name="cpwd" id="cpwd" required="true" equalTo = "#password"/><br />
			邮箱：<input type="text" name="email" id="email" required="true" email="email"/><br />
			生日：<input type="text" name="birthday" id="birthday" required="true" dateISO="yyyy-MM-dd"/><br />
			<input type="submit" value="提交" />
		</form>
	</body>
</html>

使用方法二：书写在js代码中，与html结构完成分离
这样即可以自定义提示文本，又能够增强代码的可读性。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>jQuery中的对于表单验证的插件使用2</title>
		<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
		<script type="text/javascript" src="js/jquery.validate.js"></script>
		<script type="text/javascript" src="js/messages_zh.js"></script>
		<script type="text/javascript">
			onload = function(){
				$("form").validate({
					rules:{
						"username":{
							required:true,
							rangelength:[5,15]
						},
						"password":{
							required:true,
							rangelength:[5,15]
						}
					},
					messages:{
						"username":{
							required:"用户名不能为空",
							rangelength:"用户名长度需要在5-15之间"
						},
						"password":{
							required:"密码不能为空",
							rangelength:"用户名长度需要在3-6之间"
						}
					}
				});
			}
		</script>
	</head>
	<body>
		<form action="" method="get">
			用户名：<input type="text" name="username" id="username"/><br />
			密码：<input type="password" name="password" id="password"/><br />
			确认密码：<input type="password" name="cpwd" id="cpwd"/><br />
			邮箱：<input type="text" name="email" id="email"/><br />
			生日：<input type="text" name="birthday" id="birthday"/><br />
			<input type="submit" value="提交" />
		</form>
	</body>
</html>
静安书以沫
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
jQuery多线程：如何使2个函数并行运行？
04-06
我正在开发Phonegap构建游戏应用程序，其中我们在单个屏幕上有2个部分，分别对应2个功能。 第一个功能将在第一部分显示随机图像和文本。 第二部分将在第二部分处理新级别。 现在的问题是，由于...，UI完全被打乱了。
记录jQuery同步Ajax带来的UI线程阻塞问题及解决办法
qq506930427的博客
11-23 906
实际开发中，我们享受着Ajax异步请求带来的便利，使我们开发更加快速，但是有时也需要一些同步请求来满足我们的开发需求。将Ajax中async属性设置为false，即可让Ajax请求变为同步请求，然而，Ajax中同步操作是一个巨坑。 由于开发JavaScript是单线程的，当我们使用Ajax同步请求时，线程将停在等待请求response的地方，直到收到response，线程才继续执行。这导致了程序...
jquery多线程
02-24 2250
queue 插入一个任务 delay 插入一个任务 但是类型为 queue dequeu 取出一个任务执行，如果当前任务不是queue类型的，等待任务执行完后继续取队列中的下一个任务，直到取到queue类型的任务为止 例子: $.delay(1000); $.queue(fun1)...
JQuery、JSON、AJAX、XML、IO流、多线程、反射核心知识点详解
a2285786446的博客
10-11 1168
JQuery、JSON、AJAX、XML、IO流、多线程、反射随笔，查漏补缺用
JS 线程 和 JQuery使用笔记
炘的专栏
06-21 2998
JS 线程 主界面代码：            var w = new Worker("js/JavaScript.js");         function myWorker1() {             w.postMessage("hello ");   //必须先启动线程             w.addEventListener('message',function
Java Web Jquery表单验证
07-26
编写基于Jquery的表单验证插件 Java Web Jquery表单验证 jQuery是一个流行的JavaScript库，可用于在网页上进行各种操作，包括表单验证。 1、将基于Jquery的表单验证的调查问卷分为四个部分：FrontPage.html、write....
jQuery - 3.6.0
05-04
jQuery 是一个快速、小巧且功能丰富的 JavaScript 库。它使HTML文档遍历和操作，事件处理，动画和Ajax等功能变得更加简单，它具有易于使用的API，可跨多种浏览器运行。凭借多功能性和可扩展性的结合，jQuery改变了数...
jquery-3.7.0.min.js（jQuery下载）
06-25
jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）jquery-3.7.0.min.js（jQuery下载）...
jquery性能优化高级技巧
10-23
jquery性能优化做好，速度也很快，那么如何提高jquery性能呢，本篇文章给大家介绍jquery性能优化高级技巧，需要的朋友可以参考下
JavaScript单线程还是多线程
03-29
NULL 博文链接：https://baiyejianxin.iteye.com/blog/1295730
Jquery ajax 同步阻塞引起的UI线程阻塞问题
11-24
最近做一个项目，遇到了一个问题同步ajax引起的ui线程阻塞问题，下面把我的问题解决过程分享给大家。 事情起因是这样的，因为页面上有多个相似的异步请求动作，本着提高代码可重用性的原则，我封装了一个名为getData的函数，它接收不同参数，只负责获取数据，然后把数据return。基本的逻辑剥离出来是这样的： function getData1(){ var result; $.ajax({ url : "p.php", async : false, success: function(data){ result = data;
jquery-3.3.1.js和jquery-3.3.1.min.js
03-22
jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-3.3.1.js和jquery-3.3.1.min.js免费下载哈。jquery-...
jquery-migrate
03-05
jQuery 迁移插件， Migrate 有两个版本。jquery-migrate-1.4.1版本将帮助您将 1.9 之前的 jQuery 代码更新到 jQuery 1.9 到 3.0。 jquery-migrate-3.4.0版本将帮助您更新代码以在 jQuery 3.0 或更高版本上运行。 ...
JQuery - 多线程编程
weixin_30632883的博客
03-21 1149
1.引入 Deferred 对象的概念 1 　　var wait = function(dtd){ 2 3 　　　　var tasks = function(){ 4 5 　　　　　　alert("执行完毕！"); 6 7 　　　　　　dtd.resolve(); // 改变Deferred对象的执行状态 8 9 　　　　}; 10 11...
jquery等待一秒后执行_CountDownLatch实现多线程等待后共同执行
weixin_39556474的博客
11-30 1603
01 CountDownLatchCountDownLatch 通过 count 计数实现屏障设定（阻塞），当满足设定的条件后一个或者多个线程时候一起执行。这里的屏障指的就是一个线程会被阻塞，不再继续向下执行。CountDownLatch 中的计数器会做减法。当执行到它的 await（）方法之后，如果计数器不为 0，则阻塞，知道其他线程调用 countDown（）之后扣减计数为 0 之后，原本阻塞...
利用JQuery的异步方法和ASP.NET多线程功能，实时获取事务处理进度
月孤狼的程序人生
12-28 444
整理了好久才完善了这个功能，仅供大家参考。这种功能主要用于一些比较耗时的事务处理。比如大量数据导入导出操作，需要耗费一定时间的复杂计算操作等。为了增加前台体验感受，所以需要实时反馈后台处理进度。 有一种做法是，事务处理期间前台展示一个等待遮罩，但缺点是无法看到事务进度。 本程序缺点是没有展示进度百分比（不过你可以自己添加这个功能），优点是：1、有处理总时间，甚至还可以展示每一个步骤的用时；2、...
jquery多个方法先执行顺序,java多个方法执行顺序
最新发布
阿发狗伪原创
10-31 89
java是单线程语言，单线程就是所执行的代码必须按照顺序，同一时间只能做一件事。作为浏览器脚本语言，JS的主要用途是与用户互动，以及操作DOMPython解释器的安装步骤。这决定了它只能是单线程，否则会带来很复杂的同步问题。为了利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JS脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM。所以，这个新标准并没有改变JS单线程的本质。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

静安书以沫

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值