jQuery几种选择器的总结

最新推荐文章于 2022-07-29 01:20:34 发布

筏镜

最新推荐文章于 2022-07-29 01:20:34 发布

阅读量426

点赞数 1

分类专栏： jQuery 文章标签： html jQuery

本文链接：https://blog.csdn.net/fajing_feiyue/article/details/99186889

版权

jQuery 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

1、select 选中 option
option:selected

<script type="text/javascript">
	$(function(){
       $("#add").click(function(){
					$("#selectLeft option:selected").appendTo($("#selectRight"))
				})

}
	</script>
	
<select id="selectLeft" multiple>
	<option>IPhone6s</option>
	<option>小米4</option>
	<option>锤子T2</option>
</select>

<select id="selectRight" multiple="multiple">
	<option>三星Note3</option>
	<option>华为6s</option>
</select>

2、input标签的属性选择
input[name=“love”]’)

<script type="text/javascript">
	$(function(){
     	
	$('div input[name="love"]').each(function(index,element){
		console.log(element.value+":::"+$('#id').val())
		element.checked=(element.value===$('#id').val());	
	})

}
	</script>
	
<div style="width:200px;background:red;" id="id2">
	<input type="checkbox" name="love" value="北京"/>北京
	<input type="checkbox" name="love" value="南京"/>南京
	<input type="checkbox" name="love" value="上海"/>上海
</div>

我们在学习选择器的时候，知道有三种基本选择器，但很多时候当选择器稍微复杂一点，又没有经常使用会经常忘记。故在此做如下记录。

<script type="text/javascript">
			//jquery的三种基本选择器
			//第一中id选择器
			//语法:$("#id")
			
			$(function(){
				//这里面的代码是当文档加载完毕之后执行的
				//找到id问btn的那个标签
				var $bt = $("#btn")
				//alert($bt.val())
				
				//第二种:类选择器
				//语法:$(".类名")
				var $ipts = $(".user")
				//获取到的$ipts是一个jQuery对象，其实也是一个js对象的数组。
				//alert($ipts.length)
				
				//第三种:标签选择器
			//	var $items = $("input")
			//	alert($items.length)

				$("#btn2").click(function(){
					console.log("21323");
				})
			})

			function handleClick(){
				alert("sdfdfs");
			}
		</script>
	</head>
	<body>
		<input type="button" id="btn" value="按钮" /><br />
		<input type="text" value="张三" class="user" /><br />
		<input type="text" value="李四" class="user"/><br />
		<input type="text" value="王五" class="user"/><br />
		<input type="text" value="赵六" class="user"/><br />
		<button  onclick="handleClick()" id="btn2"  >点击</button>
	</body>