Dor*_*şin 1 javascript css jquery
我正在尝试改变div的宽度.但$(div#i)不是真的.我怎样才能做到这一点？
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script>
var things = new Array();
things[0] = 13; things[1] = 26; things[2] = 39;
for(var i=0;i<things.length;i++)
$(div#i).css("width",things[i]*100);
</script>
</head>
<body>
<div id="0" style=" width: 300px; height:20px; margin-left: 25px; padding-left: 15px; background-color: #900"> </div> <br>
<div id="1" style=" width: 300px; height:20px; margin-left: 25px; padding-left: 15px; background-color: #900"> </div> <br>
<div id="2" style=" width: 300px; height:20px; margin-left: 25px; padding-left: 15px; background-color: #900"> </div>
</body>
</html>
log*_*yth 11
选择器应该是字符串,并且您不需要'div',因为ids必须是唯一的.此外,正如评论中所提到的,严格数字的ID仅在HTML5中有效,因此如果您希望在旧浏览器上一致地工作,我建议使用data-index我在下面发布的方法.
$('#' + i).css("width",things[i]*100);
我还使用Array文字语法.
var things = [13, 26, 39];
在id的唯一性和兼容性方面,我真的建议你不要使用,id因为它没有真正的语义价值.
而不是<div id="...",我会做<div data-index="..."和使用jQuery的自动收集迭代css.
$('[data-index]').css('width', function(){
return things[$(this).data('index')] * 100);
});
但实际上,如果数组中div和它们的索引之间存在一对一的关系,您也可以这样做,而不需要HTML中的任何额外属性.
$('body > div').css('width', function(i){
return things[i] * 100;
});
还要记住,您需要将所有这些包装在ready回调中,而您在示例中没有这样做.
| 归档时间： |
|
| 查看次数： |
1870 次 |
| 最近记录： |