JQuery部分内容整理

最新推荐文章于 2022-08-27 16:47:43 发布

VIP文章冉筱

最新推荐文章于 2022-08-27 16:47:43 发布

阅读量175

点赞数 1

分类专栏：【Web前端基础】

本文链接：https://blog.csdn.net/weixin_44146025/article/details/104792048

版权

JQuery简介

Jquery是一个js的框架(JSd1类库），对传统的js进行封装。
使用JQuery可以兼容各种游览器，方便的处理HTML、Events、动画效果等，方便的为网站提供AjAX交互。
JQuery写法的简单性，易用性大大提升了人民对它的使用。
使用JQuery可以做到，html页面代码和控制的分离，彻底将控制代码放入一个单独的js文件。
使用JQuery需要引入JQuery的js文件，可以从https://jquery.com/下载

Jquery选择器

基本选择器

使用JQuery进行定位时注意语法的特点，“$”符号接小括号

id 选择器：$("#id")

类选择器:$(.class)

元素选择器:$("元素名")

通配符选择器:$("*")

并列选择器:$("选择器，选择器，选择器")

层次选择器

后代选择器：使用空格，所有后代包含孙子以下的元素

子元素选择器：使用> 第一层的元素（儿子）

下一个元素：使用+ 下一个同辈元素

兄弟元素：使用~ 后面所有的同辈元素

过滤选择器（过滤选择器以":" 或"[]"开始）

基本过滤选择器

内容过滤选择器

可见性过滤选择器

属性过滤选择器

表单选择器

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>JQuery选择器</title>
	<script src="Jquery.js"></script>
	<script>
		//初始化加载
		window.onload=function(){
			//基本选择器
			var $div1 =	$("#div1");//ID选择器
			alert($div1.text());
			var $div = $(".div");//class选择器
			//alert($div.length);
			var $div1 = $("div");//标签选择器
		//	alert($div.text());
			//console.info($("*"));//所有选择器
			$("#div1,.span").css("background-color","red");//并列选择器
			
			//层次选择器
			//console.info($("#div3 span"));//后代选择器
			console.info($("#span2>span"));//直接子元素	
			console.info($("#span2+span"));//下一个兄弟元素

最低0.47元/天解锁文章

冉筱

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery部分内容整理

基本选择器使用JQuery进行定位时注意语法的特点，“$”符号接小括号 id 选择器：$("#id") 类选择器:$(.class) 元素选择器:$("元素名") 通配符选择器:$("*") 并列选择器:$("选择器，选择器，选择器")层次选择器后代选择器：使用空格，所有后代包含孙子以下的元素子元素选择器：使用> 第一层的元素（儿子）下一个元素：使用+ ...
复制链接

扫一扫