jQuery 之基本选择器

最新推荐文章于 2016-09-16 16:13:51 发布

zjsunzone

最新推荐文章于 2016-09-16 16:13:51 发布

阅读量104

点赞数

分类专栏： jQuery 文章标签： jquery JavaScript java 选择器 ViewUI

jQuery 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

[quote][color=olive][b] N2 ：JQuery 选择器

1、类型：
基本选择器：
层次选择器：
过滤选择器：
* 简单过滤选择器
* 内容过滤选择器
* 可见性过滤选择器
* 属性过滤选择器
* 子元素过滤选择器
* 表单对象属性过滤选择器
表单选择器：

1.1:基本选择器
#id 根据指定id匹配元素，返回单个元素；(唯一性)$("#x");
.calss 根据指定的类名匹配元素，返回集合元素；$(".t");
element 根据给定的元素名匹配,返回结合元素；$("p");
* 匹配所有的元素，返回结合元素；
s1,s2,s3将每一个选择器匹配到的元素合并后一起返回，
例如：$("div,span,p,myClass");[/b][/color][/quote]

[size=medium][color=red][b]案例：[/b][/color][/size]

		<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
		<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
		<html>
			<head>
				<!-- ************************** 导入 *********************************** -->
				<script type="text/javascript" src="js/jquery-1.8.3.js">
		</script>
				<!-- ************************************************************* -->


				<script type="text/javascript">

		//程序入口
		$(document).ready(function() {
			test();
		});

		//提示:JQuery中的调用关系和java中方法调用类似
		function test(){

			$("#id").click(function(){
				alert("测试#id选择器");
			});

			$(".class").click(function(){
				alert("测试.class 选择器");
			});

			$("p").click(function(){
				alert("测试element选择器");
			});

			$("p,div.class").click(function(){
				alert("测试了selector1多选择器");
			});
		}
		</script>
			</head>
			<body>
				<h3>基本选择器测试</h3>
				<div id="id">测试#id选择器</div>
				<div class="class">测试.class选择器</div>
				测试element选择器1

				测试element选择器2

				测试element选择器3

			</body>
		</html>

zjsunzone

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery 之基本选择器

[quote][color=olive][b] N2 ：JQuery 选择器1、类型：基本选择器：层次选择器：过滤选择器： * 简单过滤选择器 * 内容过滤选择器 * 可见性过滤选择器 * 属性过滤选择器 * 子元素过滤选择器 * 表单对象属性过滤选择器表单选择器： ...
复制链接

扫一扫