<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>yoyo.html</title>
<style type="text/css">
div input{
display: none;
}
</style>
<!--导入jquery-->
<script type="text/javascript" src="../js/jquery-1.11.0.min.js" ></script>
<script type="text/javascript">
$(function() {
//需求: 选取所有的文本隐藏域, 并打印它们的值
$("#b1").click(function(){
//方式1:使用jq对象的方法
//[ele0,ele1,ele2,ele3] dom对象
$("input:hidden").each(function(index,ele){
//这里应该明确,遍历得到的ele为dom对象,所以这里可以直接用this表示当前对象,然后.属性名获得属性值
//或者将this封装成jq对象$(this),然后利用jq对象.val()方法获得属性值
alert(index+" "+ele.value+" "+this.value+" "+$(this).val());
});
});
$("#b2").click(function(){
//方式2:全局函数
$.each($("input:hidden"), function(index,ele){
//此处的ele获得的 也是dom对象,与方式1相同
alert(index+" "+ele.value+" "+this.value+" "+$(this).val());
});
});
//遍历普通的js 数组
var arr = [3,"tom",false];//数组不想写new,可以这样简写
$("#b3").click(function(){
//全局函数遍历js对象(数组)
// $.each(arr, function(index,ele) {
// alert(index+" "+ele+" "+this); //注意这里获取的ele直接就是数组中的元素
// });
//由于方式1只能遍历jq对象所以为了遍历js对象,可以先将js对象转成jq对象,然后使用方式1
$(arr).each(function(index,ele){
alert(index+" "+ele+" "+this);
});//each
});//按钮3,遍历普通js数组
});//页面加载成功时间
</script>
</head>
<body>
<input type="button" value=" 选取所有的文本隐藏域, 并打印它们的值" id="b1" />
<input type="button" value=" 选取所有的文本隐藏域, 并打印它们的值" id="b2" />
<input type="button" value=" 遍历数组" id="b3" />
<br /><br />
<!--文本隐藏域-->
<input type="hidden" value="hidden_1">
<input type="hidden" value="hidden_2">
<input type="hidden" value="hidden_3">
<input type="hidden" value="hidden_4">
<div>
<input type="text" name="date" id="date" value="哈哈哈哈" />
</div>
<!--还有一个注意点:
可见性过滤器有两个,一个是visible(可见的,没什么可说的) 另一个是hidden,
hidden为选择不可见的,这里的不可见一般有两种情况,一种就是文本隐藏域,如62-65行代码
另一种是指css样式中 定义元素的显示类型关键字 display 的值为none的情况
即:(hidden不可见) 主要针对的是 文本隐藏域和指定display=none
-->
</body>
</html>
HTML_jQuery中关于this的理解2 (jQuery遍历,可见性过滤选择器__hidden)
最新推荐文章于 2021-03-17 12:15:01 发布