jQuery 笔记

贡献者： addis

本文处于草稿阶段。

预备知识　JavaScript 入门笔记

如果你使用 React 或 Vue 这样的框架，就不许需要 jQuery
jQuery 命令通常在 document ready 内部使用 $(document).ready(function(){/*jQuery 命令*/});，另一种等效的格式为 $(function(){/*jQuery 命令*/})
Selector: $("p") 选择所有 <p>...</p> 元素。例如：$(document).ready(function(){$("button").click(function(){$("p").hide();});}); 其中 click(回调函数) 设置按钮的回调函数，即 $("p").hide()，隐藏所有段落。相反，.show() 重新显示。
.hide(speed, callback) 其中 speed 是毫秒，callback 是完成后的回调
.toggle() 或者 .toggle(speed, callback) 让隐藏的元素显示，显示的元素隐藏
$("#id") 选中所有指定 id 的元素
$(".class") 选中所有指定 class 的元素

　　事件

$(document).ready() 网页渲染完成
.click() 按下，.dbclick() 双击
.mouseenter() 鼠标进入元素。例子：$(document).ready(function(){$("#p1").mouseenter(function(){做一些事});});
.mouseleave() 离开元素，.mousedown() 按下鼠标左键，.mouseup() 松开鼠标左键。
.hover(fun1,fun2) 相当于 .mouseenter(fun1); .mouseleave(fun2);
<input> 元素有 $("input").focus() 和 .blur()，分别是光标选中和离开
动画没有执行完就可以执行下面的代码（异步）

1. DOM manip

Document Object Model (DOM) 代表整个 html 页面的结构树。
allows programs and scripts to dynamically access and update the content, structure, and style of a document
attr(属性) 获取元素的属性，如 $("#id").attr("href")

　　一个实时获取鼠标坐标的例程

<!DOCTYPE html>
<html>
<head>
	<script src=
	"https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script>
		$(document).mousemove(function(event) {
			$("#btn1").text(event.pageX + ", " + event.pageY);
		});
	</script>
</head>
<body>
	<button id="btn1">Show Text</button>
</body>
</html>

致读者：小时百科一直以来坚持所有内容免费无广告，这导致我们处于严重的亏损状态。长此以往很可能会最终导致我们不得不选择大量广告以及内容付费等。因此，我们请求广大读者热心打赏 ，使网站得以健康发展。如果看到这条信息的每位读者能慷慨打赏 20 元，我们一周就能脱离亏损，并在接下来的一年里向所有读者继续免费提供优质内容。但遗憾的是只有不到 1% 的读者愿意捐款，他们的付出帮助了 99% 的读者免费获取知识，我们在此表示感谢。