phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
网站测速
小皮面板
智能dns
搜索
首页
PHP教程
jQuery Selectors(选择器)的使用(一、基本篇)
jQuery Selectors(选择器)的使用(一、基本篇)
我的学习方法:先入门,后进阶!本系列文章分为:基本篇、层次篇、简单篇、内容篇、可见性篇、属性篇、子元素篇、表单篇、表单对象属性篇共9篇文章。
详细介绍页面 http://demo.phpstudy.net/html/jquery/jQuery-Selector.html
jQuery-Selectors
jQuery-Selectors(选择器)的使用(一、基本篇)
本系列文章主要讲述jQuery框架的选择器(Selectors)使用方法,我将以实例方式进行讲述,以简单,全面为基础,不会涉及很深,我的学习方法:先入门,后进阶!
本系列文章分为:基本篇、层次篇、简单篇、内容篇、可见性篇、属性篇、子元素篇、表单篇、表单对象属性篇共9篇文章。
您对本系列文章有任何建议或意见请发送到邮箱:sjzlgt@qq.com
由于是第一次写技术性系列文章,难免会出错或代码BUG,欢迎指出,在此谢过!
您可以到jQuery官网来学习更多的有关jQuery知识。
版权所有:白夜 博客 转载请保留出处和版权信息!
1. #id用法
定义:根据给定的ID匹配一个元素。
返回值:Element
参数:id (String) : 用于搜索的,通过元素的 id 属性中给定的值
实例:将ID为"div_red"的DIV的边框改为红色
代码:$("#div_red").css("border","red 2px solid");
//点击按钮一将执行这句代码
DIV ID="div_red"
扩展:#id中的id可以是页面任何元素的id,如input,btuuon,div,table,span等等
2. element用法
定义:根据给定的元素名匹配所有元素。
返回值:Array<Element>
参数:element (String) : 一个用于搜索的元素。指向 DOM 节点的标签名。
实例:将页面<P>标记内的文字颜色改为红色
代码:$("p").css("color","red");
//点击按钮二将执行这句代码
P标记1 ID="p1"
P标记2 无ID
扩展:参数值可以是页面任何元素,如div,button,div,table,tr,td,p,h1,span,input
3. .class用法
定义:根据给定的类(样式名称)匹配元素。
返回值:Array<Element>
参数:class (String) 一个用以搜索的类(样式名称)。一个元素可以有多个类(样式名称),只要有一个符合就能被匹配到。
实例:将页面所有引用了".red_test"样式的元素背景颜色改为蓝色
代码:$(".red_test").css("background-color","blue");
//点击按钮三将执行这句代码
DIV ID="div_red_1" calss="red_test"
DIV ID="div_red_2" 无class
SPAN ID="span_red_1" calss="red_test"
扩展:可以看一下jQuery官网上Selectors/.class的实例。
4. *用法
定义:匹配所有元素 多用于结合上下文来搜索。
返回值:Array<Element>
实例:查看页所有元素的数量
代码:$("*").length;
//点击按钮四将执行这句代码
扩展:可以看一下jQuery官网上Selectors/*的实例。
5. selector1,selector2,selectorN用法
定义:将每一个选择器匹配到的元素合并后一起返回。你可以指定任意多个选择器,并将匹配到的元素合并到一个结果内。
返回值:Array<Element>
参数:selector1 (Selector) : 一个有效的选择器 selector2 (Selector) : 另一个有效的选择器 selectorN (Selector) : (可选) 任意多个有效选择器
实例:将页面上所有引用名称为"li_test"样式的<Li>元素和ID为"li_red"的<Li>元素的边框改为绿色,宽度为5px
代码:$(".red_test,#btn_5").css("border","5px solid Green");
//点击按钮五将执行这句代码
Li class="li_test"
Li id="li_red"
Li
Li class="li_test"
Li
Li
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
注:因为jquery需要加载下,所以运行后请刷新一下即可看到效果。
«
»
PHP教程
PHP简介
PHP基本语法
PHP类型
PHP变量
PHP运算符
PHP控制结构
PHP函数
PHP类与对象
PHP异常处理
函数库分类
快速导航
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
Linux
Mac
ASP
服务器
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
SQLite
wamp
交通频道
Copyright © 2016 phpStudy | 豫ICP备2021030365号-3