Jquery | 基础 | 属性过滤选择器
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script language="javascript" type="text/javascript" src="jquery-3.3.1.min.js"></script>
<title>使用jQuery 属性过滤选择器</title>
<style type="text/css">
body {
font-size: 12px;
text-align: center
} div {
float: left;
border: solid 1px #ccc;
margin: 8px;
width: 65px;
height: 65px;
display: none
}
</style> <script type="text/javascript">
$(document).ready(function () {
$("#button1").click(function () { // 显示所有含有name 属性的元素
$("div[name]").show(1000); })
$("#button2").click(function(){
//显示所有属性title的值是"A"的元素
$("div[title='n']").show(1000);
})
$("#button3").click(function(){
//显示属性title的值不是"n"的元素
$("div[title!='n']").show(1000);
})
$("#button4").click(function(){
//显示所有属性title的值以"n"开始的元素
$("div[title^='n']").show(1000);
})
$("#button5").click(function(){
//显示所有属性title的值以"e"结束的元素
$("div[title$='e']").show(1000);
})
$("#button6").click(function(){
//显示所有属性title的值中含有"e"的元素
$("div[title*='e']").show(1000);
})
$("#button7").click(function(){
//显示所有属性title的值中含有"e",且属性id的值是"div2"的元素
$("div[id='div2'][title*='e']").show(1000);
})
})
</script>
</head> <body> <div id="div1" name="n1">hello</div>
<div title="n" name="n2">world</div>
<div id="div2" title="ne">good morning</div>
<div title="nef">good afternoon</div> <button id="button1">显示所有含有name 属性的元素</button>
<button id="button2">显示所有属性title的值是"A"的元素 </button>
<button id="button3">显示属性title的值不是"n"的元素</button>
<button id="button4">显示所有属性title的值以"n"开始的元素</button>
<button id="button5">显示所有属性title的值以"e"结束的元素</button>
<button id="button6">显示所有属性title的值中含有"e"的元素</button>
<button id="button7">显示所有属性title的值中含有"e",且属性id的值是"div2"的元素</button>
</body> </html>
Jquery | 基础 | 属性过滤选择器的更多相关文章
- jQuery之属性过滤选择器
转自:http://blog.csdn.net/woshisap/article/details/7341136 在HTML文档中,元素的开始标记中通常包含有多个属性(attribute), 在jQu ...
- 黑马day16 jquery&属性过滤选择器
属性过滤选择器的过滤规则是通过元素的属性来获取对应的元素 .[attribute] 使用方法: $("div[id]") ; 返回值 集合元素 说明:匹配包括给定属性的元素.样 ...
- Jquery | 基础 | jQuery表单对象属性过滤选择器
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>使用jQuery表单对象属性 ...
- jQuery选择器之表单对象属性过滤选择器Demo
测试代码: 08-表单对象属性过滤选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- jQuery表单对象属性过滤选择器
jQuery表单对象属性过滤选择器 <div id="p1" attr="p1"> <input type="text" ...
- 【转】jQuery属性过滤选择器
属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素. [attribute] 选取用次属性的元素 [attribute=value] 选取属性值为value的元素 [attribute ...
- 009 jquery过滤选择器-----------(表单对象属性过滤选择器 与 表单选择器)
1.表单对象属性选择器 2.程序 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...
- Jquery | 基础 | 使用 jQuery 表单过滤选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery中的表单对象属性过滤选择器(四、八)::enabled、:disabled、:checked、:selected
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...
随机推荐
- 软件版本号(BETA、RC、ALPHA、Release、GA等)
Alpha: Alpha是内部测试版,一般不向外部发布,会有很多Bug.除非你也是测试人员,否则不建议使用.是希腊字母的第一位,表示最初级的版本,alpha 就是α,beta 就是β , ...
- Monkey测试的参数
一.Monkey测试简介 Monkey测试是Android平台自动化测试的一种手段,通过Monkey程序模拟用户触摸屏幕.滑动Trackball.按键等操作来对设备上的程序进行压 力测试,检测程序多久 ...
- 使用virtualenv, uwsgi, nginx来布署flask
本文讲述了怎样使用virtualenv, uwsgi, nginx来布署flask的步骤. 升级软件包 运行下面命令,保证你的机器安装了最新的软件包. sudo apt-get update sudo ...
- 减肥 day1
今天是我减肥第一天,现在体重是147斤, 早晨吃了一碗面,喝了一碗奶,中午吃了一个apple. 6点钟去打篮球,晚上去食堂稍微吃一点东西.
- Model drivern
<s:hidden name="id" value="%{role.id}"></s:hidden> 其中的value传到后台是有类型的 ...
- poj 1195 Mobile phones 解题报告
题目链接:http://poj.org/problem?id=1195 题目意思:有一部 mobie phone 基站,它的面积被分成一个个小正方形(1 * 1 的大小),所有的小正方形的面积构成了一 ...
- Python安装pip3常见问题
安装pip3 1.安装 zlib组件: 安装完成后,执行命令 python3 -m pip install redis,报错: RuntimeError: Compression requires t ...
- [原创]java获取word里面的文本
需求场景 开发的web办公系统如果需要处理大量的Word文档(比如有成千上万个文档),用户一定提出查找包含某些关键字的文档的需求,这就要求能够读取 word 中的文字内容,而忽略其中的文字样式.表格. ...
- DFS Used%: NaN%问题
一.问题描述: [root@master sbin]# hdfs dfsadmin -report Configured Capacity: 0 (0 B) Present Capacity: 0 ( ...
- [存档]获取通讯录信息并写到SD卡上
下面是代码,不过没有字母表的顺序排列: package com.example.getcontacts; import java.io.FileWriter; import java.io.IOE ...