1 ,jQuery介绍

1.1,jquery的介绍,javascript库的关系。体验jquery。把js兼容性代码封装在jquery.js中,本身就是一个javascript库。

1.2,jQuery对象 和 dom 对象 互转

*DOM对象 != jQuery对象
*
*dom对象
*var btnObj = doucument.getElementbyId("btn");

*jQuery 对象
*$(btnObj)------dom转jQuery
*
*jQuery转dom
*$(btnObj)[0]-----------------------或者jQuery对象.get(0);

2,选择器获取元素

*1.1、id 选择器
语法: $("#id选择器的值")

*

1.2、标签选择器
语法: $("标签名")
*

1.3、类选择器
语法:$(".类样式名") ,注意前面的点。

1.4、并集选择器
语法:$("div,p,span"),中间使用逗号隔开。
如果上面的 div 有 id 选择器 dv;span 有类选择器 cls;
上面的写法也可以这样写: $("#dv, p, .cls")

1.5,交集选择器
语法:$("div.cls")
标签名 + 类样式的方式。
// 选择所有div标签中class属性名为.cls的所有div元素 同时满足两个条件

1.6、后代选择器
语法:$("div ul span")
选择 div 下面所有 ul 下的所有的 span 标签,不包括 div 下面的 span,必须在 ul 里面。

1.7、子代选择器
语法:$("div>span")
选择 div 的直接下一代的所有span,不能隔代。

1.8、兄弟选择器
语法:$("div~span")
选择的是 div 后面的所有兄弟标签为 span 的标签

1.9、直接兄弟选择器
语法:$("div+span")
选择的是div 后面的直接兄弟标签,如果这个直接兄弟为 span 标签则选中,如果为其他标签则不选中。

3,jquery中的一些方法·

1,jQuery对象 中的 .text() ,如果括号中没有值的话,是获取文本内容;如果有值的话,就是设置文本内容。jquery对象 的 text("值")----设置文本

2,元素.html(); html(); // 获取或设置标签的html内容----相当于DOM中的innerHTML

3,jQuery中使用 jQuery对象.css("属性":"值"); 的方式设置标签的样式。

4, jQuer对象.val();---------表示是获取该元素.value值。jQuer对象.val("值")------设置value值

 


5,show():设置元素显示,括号中可以写数字,表示过度效果时间(ms)

6,hide() :设置元素隐藏,括号中可以写数字,表示过度效果时间(ms)

7,stop():清除动画效果残留

8,find();参数为标签名,从当前对象找到符合要求的所有子元素。

jQuery-day01-介绍 和 选择器获取元素的更多相关文章

  1. jQuery的介绍和选择器详解

    本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍 引入 jQuery 的原因 在用 js 写代码时, ...

  2. Python全栈开发之路 【第十五篇】:jQuery的介绍和选择器

    本节内容 什么是jQuery? write less,do more. jQuery是一个快速,小巧,功能丰富的JavaScript库. 它通过易于使用的API在大量浏览器中运行,使得HTML文档遍历 ...

  3. jquery outerHeight方法 outerWidth方法 获取元素实际宽度高度

    曾经写代码中,每当须要获取元素的实际"宽度"(这里的宽度是指元素宽度加上其边距)时,都须要用元素宽度加上margin值才行,今天发现一个叫outerWidth(options)的方 ...

  4. JQuery的介绍及选择器

    1.什么是JQuery. JavaScript开发的过程中,处理浏览器的兼容很复杂而且很耗时,于是一些封装了这些操作的库应运而生.这些库还会把一些常用的代码进行封装. 把一些常用到的方法写到一个单独的 ...

  5. js+jquery动态设置/添加/删除/获取元素属性的两种方法集锦对照(动态onclick属性设置+动态title设置)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140 ...

  6. 怎样通过CSS选择器获取元素节点或元素节点集合

    使用 document.querySelector() 和 document.querySelectorAll(), 将 CSS选择器 作为参数传入即可. // 标签选择器 document.quer ...

  7. JQuery获取元素类名

    一般而言,JQuery可以利用attr来获取元素的属性值, 1.$("元素").attr("属性");                //获取指定属性的值 2. ...

  8. 跟随标准与Webkit源码探究DOM -- 获取元素之querySelector,querySelectorAll

    使用CSS选择器获取元素 -- querySelector,querySelectorAll(HTML5) 标准 W3C Selector API Level 1为Document,DocumentF ...

  9. jQuery 的介绍

    引入 jQuery 的原因 在用 js 写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题. 书写很繁琐,代码量多. ...

随机推荐

  1. [转] xgboost

    还是不太明白,先mark一下 https://blog.csdn.net/v_july_v/article/details/81410574

  2. selenium模块

    一 介绍 二 安装 三 基本使用 四 选择器 五 等待元素被夹在 元素交互操作 其他 项目联 一 介绍 selenium最初是一个自动化测试的工具,而爬虫中使用它主要是为了解决requests无法直接 ...

  3. mybatis一对多查询之collection的用法

    首先看一下返回的数据的格式: //获取端子信息List<Map<String, Object>> portList = doneTaskDao.queryTroubleTask ...

  4. fiddler抓包——IOS

    fiddler抓包——IOS1.在fiddler上安装证书CertMakerhttps://www.telerik.com/fiddler/add-ons安装可以参考:https://blog.csd ...

  5. dash视频服务器本地搭建 (初探)

    2019-4-17 15:54:17 星期三 技术说明: dash: 将一个大视频分解成不同分辨率, 不同清晰度的小视频, 以及一个描述文件(后缀: mpd), 根据网络带宽自动调整视频流, 看起来更 ...

  6. python学习第34天

    # 互斥锁# 进程之间的数据共享 # 关于数据安全的问题# 进程池(自己了解,后面线程部分还会讲) # from multiprocessing import Pool# 线程的概念 (面试的重点)# ...

  7. Maven将代码及依赖打成一个Jar包的方式

    Maven可以使用mvn package指令对项目进行打包,如果使用java -jar xxx.jar执行运行jar文件,会出现"no main manifest attribute, in ...

  8. 安装Spotlight On Unix监控Linux

    1.安装Spotlight 一步一步按提示安装即可- 2.安装sysstat 在Linux上,必须安装sysstat包,用户才可以获取详细的磁盘I/O信息. 执行 rpm -qa |grep syss ...

  9. 前端工具mock的使用 - 造数据模拟网络请求

    前后端同步开发过程中,有时候前端页面完成了,需要等待后端接口完成部署后才能联调. 这个时候如果不想等待,想自己造数据模拟网络请求,这种情况就能用到mock工具了. mock工具可以用在web网站,也能 ...

  10. ASP.NET Core 的 `Core` 有几种写法?

    一.概述 本文将会根据情况持续更新. 作为一个 Framework,ASP.NET Core 提供了诸多的扩展点.使用内置的组件和默认的配置通常就能够满足部分需求,当需要扩展的时就需要先去找出这些扩展 ...