jQuery-day01-介绍 和 选择器获取元素
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-介绍 和 选择器获取元素的更多相关文章
- jQuery的介绍和选择器详解
本文最初发表于博客园,并在GitHub上持续更新前端的系列文章.欢迎在GitHub上关注我,一起入门和进阶前端. 以下是正文. jQuery 的介绍 引入 jQuery 的原因 在用 js 写代码时, ...
- Python全栈开发之路 【第十五篇】:jQuery的介绍和选择器
本节内容 什么是jQuery? write less,do more. jQuery是一个快速,小巧,功能丰富的JavaScript库. 它通过易于使用的API在大量浏览器中运行,使得HTML文档遍历 ...
- jquery outerHeight方法 outerWidth方法 获取元素实际宽度高度
曾经写代码中,每当须要获取元素的实际"宽度"(这里的宽度是指元素宽度加上其边距)时,都须要用元素宽度加上margin值才行,今天发现一个叫outerWidth(options)的方 ...
- JQuery的介绍及选择器
1.什么是JQuery. JavaScript开发的过程中,处理浏览器的兼容很复杂而且很耗时,于是一些封装了这些操作的库应运而生.这些库还会把一些常用的代码进行封装. 把一些常用到的方法写到一个单独的 ...
- js+jquery动态设置/添加/删除/获取元素属性的两种方法集锦对照(动态onclick属性设置+动态title设置)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140 ...
- 怎样通过CSS选择器获取元素节点或元素节点集合
使用 document.querySelector() 和 document.querySelectorAll(), 将 CSS选择器 作为参数传入即可. // 标签选择器 document.quer ...
- JQuery获取元素类名
一般而言,JQuery可以利用attr来获取元素的属性值, 1.$("元素").attr("属性"); //获取指定属性的值 2. ...
- 跟随标准与Webkit源码探究DOM -- 获取元素之querySelector,querySelectorAll
使用CSS选择器获取元素 -- querySelector,querySelectorAll(HTML5) 标准 W3C Selector API Level 1为Document,DocumentF ...
- jQuery 的介绍
引入 jQuery 的原因 在用 js 写代码时,会遇到一些问题: window.onload 事件有事件覆盖的问题,因此只能写一个事件. 代码容错性差. 浏览器兼容性问题. 书写很繁琐,代码量多. ...
随机推荐
- 区块链之智能合约 solidity踩坑 --上篇
概述 最近在写合约时遇到一些坑,做一下总结: 介绍主要分一下三个方面: 对区块链的简单描述 结合业务场景,编写简单智能合约,时遇到的坑(上篇) assembly 的使用说明(下篇) 正文 进入正题之前 ...
- SimpleDateFormat 常用用法
1.SimpleDateFormat函数语法: G 年代标志符 y 年 M 月 d 日 h ...
- form表单老忘的
禁止拉伸 textarea{ resize:none; } 左侧 label 对齐注意事项 必须要和 label-width 共同使用,才会生效. 表单域标签的宽度,直接写入 Form, 子元素 fo ...
- 插入MongoDB文档:mongo控制台查看插入到MongoDB文档中的内容
const MongoClient = require('mongodb').MongoClient; const assert = require('assert'); const url = 'm ...
- spring-mybatis的整合
1.导入包 2.创建一个请求文件发送请求 <%@ page language="java" contentType="text/html; charset=UTF- ...
- 2018-2019-2 网络对抗技术 20165314 Exp4 恶意代码分析
一.原理与实践说明 1.实践目标 监控你自己系统的运行状态,看有没有可疑的程序在运行. 分析一个恶意软件,就分析Exp2或Exp3中生成后门软件:分析工具尽量使用原生指令或sysinternals,s ...
- OpenCV-Python-边缘检测
Canny边缘检测方法被誉为边缘检测的最优方法. import cv2 import numpy as np img = cv2.imread('handwriting.jpg', 0) edges ...
- HttpListener 实现web服务器
一.使用方法 1. Start()方法 允许此实例接受传入的请求.即开始监听 2. Stop()方法 处理完所有当前排队的请求后关闭HttpListener对象 3. GetContext()方法 ...
- 使用rsync备份与同步文件
在数字化时代的今天,随着个人拥有的数据量急剧增加,对其中的重要数据进行备份以保证其安全性.正确性变得越来越重要.同时,由于在公司.实验室.家里.外出等不同环境下往往使用不同的电脑设备(如台式机.笔记本 ...
- 用Python建立连接直接读取与更改Rockwell Control Logix Controller的tag值
请参考如下连接的开源项目 源代码在本地测试好用. 注: 这里所用的Python 版本是 2.7.11 https://github.com/dmroeder/pylogix