JS使用变量作为document.getElementById的id不起作用
JS use variable as id for document.getElementById Not working?
我很困惑为什么这不起作用:
var blocks = document.getElementsByTagName("td");
var i = 0;
for(i=0;i<blocks.length;i++){
var id = String(blocks[i].id);
var col_pos_y = document.getElementById(id).style.top;
alert(col_pos_y);
}
我是不是错过了什么,因为萤火虫似乎只是发出了一条空白的警报信息?有人知道为什么这不起作用吗?
这是用于生成td的的html.php代码
<table cellspacing="0" cellpadding="0" style="position: absolute; top: 80%; z-index:5;" border="0">
<?php
$blocks = array();
for($k=1;$k<=3;$k++){
$row_number = "row_".$k;
?>
<tr id="<?php echo $row_number; ?>">
<?
for($i=0;$i<=100;$i++){
if($k==1){
$rand_number = rand(0, 100);
}
else if($k==2){
$rand_number = rand(30, 100);
}
else if($k==3){
$rand_number = rand(50, 100);
}
if($rand_number<50){
for($l=0;$l<=count($blocks);$l++){
$row_counter = $k-1;
if($blocks[$l]=="row_".$row_counter."_col_".$i."_type_grass"){
$block_exists="true";
break;
}
else{
$block_exists="false";
}
}
if($block_exists=="true"){
array_push($blocks, $row_number."_col_".$i."_type_grass");
$background_position = generate_dirt_block();
?>
<td id="<?php echo $row_number; ?>_col_<?php echo $i ?>_type_grass" style="font-size: 10px; cursor: pointer; background-image:url('img/terrain.png'); background-repeat: no-repeat; background-position: <?php echo $background_position ?>; min-width: 32px; height: 32px;">
</td>
<?php
}
else{
array_push($blocks, $row_number."_col_".$i."_type_blank");
?>
<td id="<?php echo $row_number; ?>_col_<?php echo $i ?>_type_blank" style="font-size: 10px; min-width: 32px; height: 32px;">
</td>
<?php
}
}
else if($rand_number>=50 && $rand_number<=100){
array_push($blocks, $row_number."_col_".$i."_type_grass");
for($l=0;$l<=count($blocks);$l++){
$row_counter = $k-1;
if($blocks[$l]=="row_".$row_counter."_col_".$i."_type_grass"){
$block_exists="true";
break;
}
else{
$block_exists="false";
}
}
if($block_exists=="true"){
$background_position = generate_dirt_block();
?>
<td id="<?php echo $row_number ?>_col_<?php echo $i ?>_type_grass" style="font-size: 10px; cursor: pointer; background-image:url('img/terrain.png'); background-repeat: no-repeat; background-position: <?php echo $background_position ?>; min-width: 32px; height: 32px;">
</td>
<?php
}
else{
?>
<td id="<?php echo $row_number; ?>_col_<?php echo $i ?>_type_grass" style="font-size: 10px; cursor: pointer; background-image:url('img/terrain.png'); background-repeat: no-repeat; background-position: 0px -32px; min-width: 32px; height: 32px;">
<div style="width: 100%; position: relative; top: 0px;">
<div style="background-image:url('img/terrain.png'); background-repeat: no-repeat; background-position: -384px 0px; width: 32px; height: 10px; position: absolute; top: -17px;">
</div>
</div>
</td>
<?php
}
}
}
?>
</tr>
<?php
}
?>
</table>
如果getElementById()
不工作,那么尝试访问返回值上的.style.top
将出错,并且永远无法访问alert
。
元素的.style.top
属性只是空白(表示它没有用JavaScript或style
属性设置)。
如果要访问通过级联应用的属性,请使用getComputedStyle
。
如果您想通过正常流量计算出其位置,请使用offsetTop
)。
相关文章:
- 当存在多行时,行中特定项的getElementById/ID's
- 为什么我们被教导将document.getElementById(“id”)分配给一个变量,然后将该变量与属性一起使用
- document.getElementById(id)并切换多个id
- JavaScript文档.getElementById(“id”)和元素id属性
- document.getElementById('id').selectedIndex 不读取索引,而是
- IE11 中的 getElementById(id).remove() 出错
- 为什么document.getElementById(“id”)它不起作用
- document.getElementById("id") in onchange paramete
- document.getElementById("id") vs $("#id"
- document.getElementById(“id”).对jQuery执行操作
- 为什么不't document.getElementById(id).contentWindow适用于Chrom
- 使用document.getElementById(“id”)检查谷歌聊天框不起作用
- 如何使用document.getElementById(“ID”).href重定向url两次
- Javascript getElementById('id').style VS var x
- 如何替换getElementById("id").使用XPath的textContent句子
- rails中document.getElementById("id").focus()的问题
- 如何在使用document.getElementById("id"). innerhtml时改变文本
- why window[id] === document.getElementById( id )
- Javascript:多次使用document.getElementById(id).appendChild()
- document.getElementById("ID").value不起作用