JQuery笔记(新手入门)

JQuery是什么?它是JavaScript框架,什么是框架,简单的来说就是约束你使用JavaScript的库。
你受他约束它就是框架,你不受它约束它就是一个库,所以很好理解,你只要遵循它的使用规则,你就可以使用JQuery的一些功能特性。

如何学习JQuery

最好的方法就是看文档,没有之一,英文没关系,浏览器都有一个功能,那就是网页翻译
点击进入JQuery官网

如何使用JQuery

在官网下载JQuery.js到你的项目中去,即可使用,其实你可以看成是自己写的一个.js代码库,插入到代码中之后直接使用就行了。

//可以在<head>标签中加入以下代码
<script src="../js/jquery.js"></script>
//这个是你自己写的JavaScript代码,要是用到jquery.js库注意先后顺序
<script src="../js/Utils.js"></script>

如何保证自己的代码中完全加载jquery.js后再来执行

//Utils.js文件
$(document).ready(function(){

});
//也可以简化成
$(function(){

});
//$符号代表的就是jQuery自身,ready方法中传入一个回调函数用于回调(也就是闭包)
click事件绑定
//可以使用jQuery为标签绑定事件,用法如下
//demo.html中
<body>
	<p id="show"></p>

	<script src="../js/Utils.js"></script>
</body>
//Util.js
$(document).ready(function(){
	$("#show").click(function(){
		alert("show");
	});
});
使用jQuery获取元素

提示:在JavaScript中获取一个元素可以用DOM,document.getElementById(“aid”),或者document.getElementByClassName(“aclass”),class的选择器是.开头(英文句号),id的选择器是#开头。

下面是使用jquery的方式

//Utils.js
//使用jquery就需要使用jquery对象的方法
$(document).ready(function(){
	alert($("#aid").html());
	//类选择器的时候,:eq(0)可以选择数组中的第几个元素
	alert($(".yourclass:eq(0)").html());
	//html()中直接写入参数可以直接更改HTML中的文本
	alert($(".yourclass:eq(0)").html("hello"));
})

其他复杂用法请自行复习JavaScript选择器。

jquery中很多方法的实现实现是$(“要操作的元素”).hover(传入一个回调方法),例如: $(“name”).click(function(){ alert(“ok”) })

具体的用法请查看jquery文档。
发布了25 篇原创文章 · 获赞 7 · 访问量 2580

猜你喜欢

转载自blog.csdn.net/qq_44403367/article/details/105199850
今日推荐