Uncaught TypeError读取appendChild报错,变量已明确定义仍触发求助
错误原因排查
- 第一处错误:你定义的
tasksRow是独立的全局变量,不属于document对象的内置属性,代码中写document.tasksRow会读取到undefined,对undefined调用appendChild就会抛出你遇到的类型错误,直接使用tasksRow.appendChild()即可。 - 第二处错误:给ul元素添加子li元素时不能直接赋值
child属性,这是自定义的无效属性,要使用appendChild()方法将li元素挂载到ul节点下,否则生成的ul里没有实际的列表内容。
修正后可运行代码
<!DOCTYPE html> <html> <head> <style> td{ height: 150px; width: 150px; } </style> </head> <body> <table border = "1" id= "chores"> <tr id = "days"> <th>Monday</th> <th>Tuesday</th> <th>Wednesday</th> <th>Thursday</th> <th>Friday</th> </tr> <tr id = "tasks"> <td></td> <td></td> <td></td> <td></td> <td></td> </tr> </table> <script> var extraTask = document.createElement("li"); extraTask.innerHTML = "Take dishes out of dishwasher"; var extraTaskList = document.createElement("ul"); // 修正:用appendChild方法添加子元素 extraTaskList.appendChild(extraTask); var tasksRow = document.getElementById("tasks").children; tasksRow = tasksRow[3]; // 修正:直接调用变量的appendChild方法,无需加document前缀 tasksRow.appendChild(extraTaskList); </script> </body> </html>
修正后代码会在周四对应的单元格内正常显示你要添加的家务待办项。
内容的提问来源于stack exchange,提问作者ItsCat03
相关产品推荐
相关产品推荐

