JQuery第二章 选择器

选择器

1:基础选择器

	id  	#
	class	.
	标签		div
	*		通配符
	群组		#box,p
css()	一个值的时候是找这个元素的值,两个值的时候是设置样式
		举例 找元素的值:
			alert($('p').css('color'))
		举例 设置元素的样式:
			$('#txt').css('color','red');
size()  返回的元素个数
		举例:
			alert($('p').size())

实例:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			#box{
    
				color: red;
				font-size: 100px;
				background: yellow;
				
			}
		</style>
	</head>
	<body>
		<div id="box">123</div>
		<div class="box">456</div>
		<div>789</div>
	</body>
	<script src="../js/jquery-3.4.1.js" type="text/javascript" charset="utf-8"></script>
	<!--<script src="../js/jquery-1.10.1.js" type="text/javascript" charset="utf-8"></script>-->
	<script type="text/javascript">
		$(function(){
    
			//找到div元素,通过css方法改变字体的颜色
//			$('div').css('color','red')
//			$('#box').css('font-size','100px');
//			$('.box').css('font-family','宋体').css('font-size','100px');
//			$('*').css('font-weight','900');
//			$('#box,.box').css('color','red').css('font-size','100px');
//------------------------------------------------------------------------------
//			如果css方法里面是一个值的话表示获取该属性的值
//			alert($('#box').css('color'))//rgb(255, 0, 0)
//			另一种css样式的写法
//			$('.box').css({
    
//				'font-size':'100px',
//				'color':'yellow',
//				'font-weight':'900',
//				'width':'300px',
//				height:'400px',
//				background:'#ccc'
//			})
//			size()方法可以获取div的个数,新版本已经摒弃该方法
//			新版本和旧的版本都支持length属性获取长度
//			alert($('div').size());
			alert($('div').length)
		})
	</script>
</html
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值