Question

我正在尝试将新创建的元素（行和单元格）插入到ID（“dynPop”）行上方的表中（通过javascript）。当我尝试这样做时，我收到以下错误

TypeError：target为null

这是表格的HTML ......

<table>
  <tr id="dynPop">
    <td  style="color:white">
      blah blah blah blah blah
    </td>
  </tr>
</table>

这是在它之前插入新行和单元格的代码......

$rownumber = 1;
var target = document.getElementById('dynPop');
//Populate member table with chapter image row 
var $CHAP_IMAGE = $out[1];
var olr1 = document.createElement('tr');
var old1 = document.createElement('td');
var olt1 = document.createTextNode($CHAP_IMAGE);
old1.appendChild(olt1);
olr1.appendChild(old1);
$rowname = 'row' + $rownumber;
olr1.setAttribute('name', $rowname);
target.insertBefore(olr1, target);
$rownumber++;

有关为什么这个javascript代码不起作用的任何想法？

谢谢！

Answer 1

我不确定没有看到你的其他HTML，但我认为主要的问题是你的JavaScript在DOM加载之前正在执行。

您可以尝试将JavaScript放入在body元素的onload事件中调用的函数中：

<!DOCTYPE html>
<html>
<head>
    <title>asdf</title>

<script type="text/javascript">
    function doThing() {
        $rownumber = 1;
    var target = document.getElementById('dynPop');

        var $CHAP_IMAGE = "$out[1]; ";
        var olr1 = document.createElement('tr');
        var old1 = document.createElement('td'); 
        var olt1 = document.createTextNode($CHAP_IMAGE); 
        old1.appendChild(olt1); 
        olr1.appendChild(old1); 

        $rowname = 'row' + $rownumber;
        olr1.setAttribute('name',$rowname);
        target.insertBefore(target, olr1);
        $rownumber++;

    }
</script>
</head>
<body onload="doThing()">
   <table>
     <tr id="dynPop">
      <td  style="color:white">
    blah blah blah blah blah
      </td>
    </tr>
  </table> 
</body>
</html>

目标是浏览器开发工具中的空错误

1 个答案: