jQuery学习04---jQuery选择器,attr()方法的使用

最新推荐文章于 2023-05-18 10:32:16 发布

onyas

最新推荐文章于 2023-05-18 10:32:16 发布

阅读量1.6k

点赞数

分类专栏： jQuery 文章标签： jQuery选择器 attr方法的使用

本文链接：https://blog.csdn.net/zheng0518/article/details/9108757

版权

jQuery 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

一、jQuery中的选择器有以下几种

1、id选择器

2、class选择器

3、标签选择器

4、复合选择器

5、层次选择器

使用规则 $("who").when.what();

二、判断对象是否存在，attr()方法的使用

示例代码：

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=GBK">
		<link rel="stylesheet" type="text/css" href="table.css">
		<title></title>
		<script src="../jquery-1.8.2.js" type="text/javascript"></script>
		<style type="text/css">
			.cls
			{
				background-color:red;
			}
		</style>
		<script type="text/javascript">
			$(function()
			{
				$("#d1").text("id");//id选择器
				$(".cls").text("class");//class选择器
				//$("div").text("tag");//标签选择器
				//$("#d1,.cls,span").text("复合选择器");//复合选择器
				//wrap中所有的p标签
				//$("#wrap p").css("background-color","red");
				//查找直接子元素
				//$("#wrap > p").css("background-color","black");
				//之后的紧邻的div
				$("#wrap + div").css("background-color","red");
				//之后的所有div，不要求相邻
				$("#wrap ~ div").css("background-color","yellow");
				//见第三
				$("#btn").click(function()
				{
					$("#link").attr("href","http://www.baidu.com");
					//$("#link").attr("style","color:red");//行内样式
					$("#link").css({"color":"red","background-color":"blue"});//可以直持json
					$("#link").attr("class","cls");//类样式
				});
				$("#btn1").click(function()
				{
					//$("#link").attr("href","");
					$("#link").removeAttr("href");
				});
			});
			/*
				一、
				jQuery修改样式$("#id").css("background-color","red");
				获得样式      $("#id").css("background-color");
				修改value属性 $("#id").val("adadf");
				获得value属性 $("#id").val();
				二、
				如何判断对象是否存在：
				jQuery选择器返回的是一个对象数组(数组中的每一个对象还是Dom对象)，调用
				text(),html(),click()之类的方法的时候其实是对数组中的每一个元素迭代调用
				每个方法。
				所有的jQuery对象都是dom集合，所以都有一个length属性，所以以下
				if($("#id").length==0){}
				三、
				attr()方法的使用
			*/
			
		</script>
	</head>
	<body>
		<div id="d1"></div>
		<div class="cls"></div>
		<div></div>
		<p></p>
		<span></span>
		<div id="wrap">
			123
			<p>内部p</p>
			<p>内部p</p>
			<div>
				<p>内部p</p>
				<p>内部p</p>
			</div>
		</div>
		<div>后面第一个<div>
		<div>后面第二个<div>
		<br/>
		<a id="link">baidu</a>
		<input id="btn" type="button" value="set"/>
		<input id="btn1" type="button" value="remove"/>
	</body>
</html>

onyas

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
jQuery学习04---jQuery选择器,attr()方法的使用

一、jQuery中的选择器有以下几种1、id选择器2、class选择器3、标签选择器4、复合选择器5、层次选择器使用规则 $("who").when.what();二、判断对象是否存在，attr()方法的使用示例代码： .cls { background-color:red; }
复制链接

扫一扫