jQuery- jquery的选择器 275

小微 科技jQuery- jquery的选择器 275已关闭评论107字数 1229阅读模式
摘要jQuery的选择器与CSS的选择器几乎相同,一次努力学习付出两份丰厚收获jQuery 选择器按照功能主要分为“选择”与“过滤”两种选择器1 选择器的分类 1)基础选择器 2)层次...

jQuery的选择器与CSS的选择器几近相同,一次努力学习付出两份丰富收成

jQuery 选择器依照功能主要分为“选择”与“过滤”两种选择器文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

1 选择器的分类 1)基础选择器 2)层次选择器 3)表单选择器文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

1,3这类两种类型选择器最经常使用,在B/C模式的ASP.Net的前端网页中经常使用文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

2) 理解掌握jQuery选择器,通过其快速找到指定的jQuery对象文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

  • 通过jQuery选择器获取jQuery对象,使用js代码实现平等功能

1) 基础选择器 分为:id,类名,标签 ,组合与通配符*;JQ与JS实现代码对比着记忆文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

1.1 通过id获取对象文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

注意:即便页面中有多个相同的id号,JQ与JS的操作都只对第一个元素有效文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

然而:CSS却对拥有相同id的元素设置其样式时有效,可以自己测试一下文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

<script src=&34;></script> <!--引入JQ文件-->
<script type=&34;>
$ {
//通过js方式
var jsdv = document.getElementById;
console.log;//得到js对象
//通过JQ方式
var jqdv = $;
console.log;//得到JQ对象
});
</script>

1.2 通过类名获取对象文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

//通过js方式
var jsdv = document.getElementsByClassName;
console.log;//得到js对象
//通过JQ方式
var jqdv = $;
console.log;//得到JQ对象

1.3 通过标签名称获取对象文章源自微观生活(93wg.com)微观生活-https://93wg.com/4964.html

//通过js方式
var jsdv = document.getElementsByTagName;
console.log;//得到js对象
//通过JQ方式
var jqdv = $;
console.log;//得到JQ对象

1.4 通过组合选择器获取对象 选择器中 每一项通过逗号分隔

注意:使用此选择器可以得到1)同一种标签比如都是div 2)不同标签比如div与span

//通过组合方式
console.log;
//通过JQ方式
var jqdv = $; //里面有id 类名 与标签三种选择器
console.log;//得到JQ对象

1.5 通过通配符*获取所有对象

console.log;
//通过JQ方式
var jqdv = $;
console.log;//得到JQ对象

各个选择器的结果

最主要是牢记前三个经常使用的,后两个知道便可

<!DOCTYPE html>
<html xmlns=&34;>
<head>
<meta http-equiv=&34; content=&34; />
<title></title>
<script src=&34;></script><!--引入JQ文件-->
<script type=&34;>
$ {
console.log;
//通过js方式
var jsdv = document.getElementById;
console.log;//得到js对象
//通过JQ方式
var jqdv = $;
console.log;//得到JQ对象
//通过类名方式

继续阅读
 
小微
  • 版权声明: 本文部分文字与图片资源来自于网络,转载此文是出于传递更多信息之目的,若有来源标注错误或侵犯了您的合法权益,请立即通知我们(管理员邮箱:81118366@qq.com),情况属实,我们会第一时间予以删除,并同时向您表示歉意,谢谢!
  • 转载请务必保留本文链接:https://93wg.com/4964.html