一、Jquery选择器:

基本选择器; 
1、id                           #id      根据元素的id获取的唯一元素。 
2、class                     .class  样式名相同的元素。 
3、元素名                    div     所有div元素。 
4、所有                      *          所有元素。 
5、并集                       div,#spanid    所有的div 加 id是 spanid的元素。

示例:

源码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery 学习1</title>
<!-- 导入jquery库 -->
<script type="text/javascript" src="jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){ $("#btn1").click(function(){
$("#d1").css("background","#FFBBAA");
});
$("#btn2").click(function(){
$(".cd1").css("background","#FFBBAA");
});
$("#btn3").click(function(){
$("div").css("background","#FFBBAA");
});
$("#btn4").click(function(){
$("*").css("background","#FFBBAA");
});
$("#btn5").click(function(){
$("span,.cd1").css("background","#00ff00");
}); }) </script> </head>
<body>
Jquery的选择器: 基本选择器;
<br>
1、id #id 根据元素的id获取的唯一元素。
<br>
2、class .class 样式名相同的元素。
<br>
3、元素名 div 所有div元素。
<br/>
4、所有 * 所有元素。
<br/>
5、并集 div,#spanid 所有的div 加 id是 spanid的元素。
<br>
<hr>
<button id="btn1">根据id获取</button>
<button id="btn2">根据class获取</button>
<button id="btn3">根据元素名获取</button>
<button id="btn4">获取所有的元素</button>
<button id="btn5">获取指定的多个元素</button>
<div id="d1"> 根据id获取的div</div>
<div class="cd1"> 根据class获取的div</div>
<div class="cd1"> 根据class获取的div</div>
<div >根据标签获取的div</div>
<span> 这是一个span 信息</span> </body>
</html>

(4)Jquery1.8.3快速入门_基本选择器的更多相关文章

  1. (8)Jquery1.8.3快速入门_可见性选择器

    一.Jquery的可见性选择器: 可见性选择器: 1.:visable 筛选可以见的元素 2. :hidden 筛选不可见的元素 效果: 源码: <!DOCTYPE html> <h ...

  2. (6)Jquery1.8.3快速入门_过滤选择器

    一.Jquery的基本过滤选择器: 基本过滤选择器: 1. :first 选取第一个元素 2. :last 选取最后一个元素 3.:not(selector) 去除所有与给定的选择器匹配的元素 4.: ...

  3. (5)Jquery1.8.3快速入门_层次选择器

    一.Jquery的选择器: 层级选择器: 1.空格                div    span              div中的包含的所有span后代元素 2. >        ...

  4. (7)Jquery1.8.3快速入门_内容过滤选择器

    一.Jquery的内容过滤选择器: 内容过滤选择器: 1.:contains(text) 选取含有文本内容为text的元素 2. :empty 选取不包含子元素或者文本为空的元素 3.:has(sel ...

  5. Spring_MVC_教程_快速入门_深入分析

    Spring MVC 教程,快速入门,深入分析 博客分类: SPRING Spring MVC 教程快速入门  资源下载: Spring_MVC_教程_快速入门_深入分析V1.1.pdf Spring ...

  6. 【笔记目录2】【jessetalk 】ASP.NET Core快速入门_学习笔记汇总

    当前标签: ASP.NET Core快速入门 共2页: 上一页 1 2  任务27:Middleware管道介绍 GASA 2019-02-12 20:07 阅读:15 评论:0 任务26:dotne ...

  7. (1)Jquery1.8.3快速入门_helloworld

    jquery 快速入门 学习记录 1.第一个jquery程序 helloworld: 需要导入Jquery1.8.3的库 ,下载地址: jQuery1.8.3   代码令另存到本地 保存为jquery ...

  8. Robot Framework 快速入门_中文版

    目录 介绍 概述 安装 运行demo 介绍样例应用程序 测试用例 第一个测试用例 高级别测试用例 数据驱动测试用例 关键词keywords 内置关键词 库关键词 用户定义关键词 变量 定义变量 使用变 ...

  9. 【笔记目录1】【jessetalk 】ASP.NET Core快速入门_学习笔记汇总

    当前标签: ASP.NET Core快速入门 共2页: 1 2 下一页  任务50:Identity MVC:DbContextSeed初始化 GASA 2019-03-02 14:09 阅读:16 ...

随机推荐

  1. 理解React组件的生命周期

    本文作者写作的时间较早,所以里面会出现很多的旧版ES5的时代的方法.不过,虽然如此并不影响读者理解组件的生命周期.反而是作者分为几种不同的触发机制来解释生命周期的各个方法,让读者更加容易理解涉及到的概 ...

  2. Alpha冲刺 - (4/10)

    Alpha冲刺 - (4/10)   Part.1 开篇 队名:彳艮彳亍团队 组长博客:戳我进入 作业博客:班级博客本次作业的链接 Part.2 成员汇报 组员1(组长)柯奇豪 过去两天完成了哪些任务 ...

  3. FPGA的发展史及FPGA 的基础架构

    通过了解早期FPGA的发展,理解FPGA究竟是干什么的,FPGA到底在电子设计领域起到了什么样的作用,下面是一张早期的设计过程 早期的设计流程过程中,只有当硬件完成了才能够得到功能的验证,随着集成电路 ...

  4. IPC_管道

    1.管道特点: 1)单向数据通信 2)匿名管道-常用于(父子进程/有血缘关系的进程之间) 3)命名管道-常用于(无血缘关系进程之间通信) 4)提供一种流式服务(发送和接受不接受字节数的大小,可取任意大 ...

  5. 第 1 篇 Scrum 冲刺博客

    各个成员在 Alpha 阶段认领的任务 姓名 Alpha 阶段认领的任务 徐婉萍 创建服务器.域名,环境搭建查询界面及页面的设计,查询方法的编写 谭燕 支出.收入添加界面及设计,收入.支出的方法编写, ...

  6. JQuery Mobile - 固定住页面和页脚

    在点击页面空白时候,页眉和页脚会隐藏,在页眉和页脚加入以下代码就可以了: data-tap-toggle ="false" 例子: <div data-role=" ...

  7. 手机端3d旋转木马效果+保存图片到本地

    <!DOCTYPE html> <html> <head> <title></title> <meta charset="U ...

  8. 手动封装on,emit,off

    on 绑定 emit 触发 off 解绑 //存放事件eventList = {key:valhandle:[]} 1对多on(eventName,callback);handle:-------N多 ...

  9. 8:String类

    String类 String类的特点: 字符串对象一旦被初始化就不会被改变. 字符串是最常用的类型之一,所以为了使用方便java就给封装成了对象方便使用  public static void str ...

  10. hystrix降级初步学习

    通过hystrix可以进行服务的限流.熔断.降级 配置 服务端Eureka server: port: 8761 # 指定该Eureka实例的端口 eureka: client: registerWi ...