Javascript jquery在append之后追加一个元素

所以我有两个对象，一个包含主管，另一个包含员工数据，还有对应于员工的主管ID（将用于ul ID）。我希望它们使用JQuery append如下所示：

• 主管A
  • 员工1

  • 雇员2

• 主管B
  • 雇员3

  • 雇员4

或以HTML格式：

<ul id="myEmployee">
   <li> Supervisor A
      <ul id="supervisorA">
          <li id="employee1">Employee 1</li>
          <li id="employee2">Employee 2</li>
      </ul>
   </li>
   <li> Supervisor B
      <ul id="supervisorB">
          <li id="employee3">Employee 3</li>
          <li id="employee4">Employee 4</li>
      </ul>
   </li>
</ul>

使用for循环，我首先附加监控程序

for (let x = 0; x < supervisor.length; x++) {
   $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for（设x=0；x”+主管[x].显示名称+”
>）；
}

问题来了，当我试图使用另一个for循环将雇员附加到包含主管id的ul中时

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li>' + employee[x].employeeID+'</li>');
}

for（设x=0；x'+employee[x].employeeID+''）；
}

控制台告诉我JQuery找不到我之前附加的ul的ID。换句话说，jQuery认为ul id没有初始化

有办法解决这个问题吗？

您正在以错误的方式访问对象

第一个循环修复：

 $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li>' + employee[x].employeeId+'</li>');
}

$（“#myEmployee”）.append（“
”+supervisor[x].DisplayName+”

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li>' + employee[x].employeeId+'</li>');
}

for（设x=0；x'+employee[x].employeeId+''）；
}

您正在以错误的方式访问对象

第一个循环修复：

 $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li>' + employee[x].employeeId+'</li>');
}

$（“#myEmployee”）.append（“
”+supervisor[x].DisplayName+”

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li>' + employee[x].employeeId+'</li>');
}

for（设x=0；x'+employee[x].employeeId+''）；
}

您必须了解JS数组和对象是如何工作的。首先要明白这一点，然后你就会发现哪里出了问题

将第一个循环更改为：

for (let x = 0; x < supervisor.length; x++) {
   $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li id=' + employee[x].employeeID + '>' + employee[x].DisplayName+'</li>');
}

for（设x=0；x”+主管[x].显示名称+”
>）；
}

第二个循环是：

for (let x = 0; x < supervisor.length; x++) {
   $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li id=' + employee[x].employeeID + '>' + employee[x].DisplayName+'</li>');
}

for（设x=0；x'+employee[x].DisplayName+''）；
}

您必须了解JS数组和对象是如何工作的。首先要明白这一点，然后你就会发现哪里出了问题

将第一个循环更改为：

for (let x = 0; x < supervisor.length; x++) {
   $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li id=' + employee[x].employeeID + '>' + employee[x].DisplayName+'</li>');
}

for（设x=0；x”+主管[x].显示名称+”
>）；
}

第二个循环是：

for (let x = 0; x < supervisor.length; x++) {
   $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#'+employee[x].SupervisorID).append('<li id=' + employee[x].employeeID + '>' + employee[x].DisplayName+'</li>');
}

for（设x=0；x'+employee[x].DisplayName+''）；
}

您提供的示例数据显示了2个对象数组，而不是2个对象。正如上面@Andreas指出的，您也没有正确地访问数组索引和对象键

更正代码以访问jQuery中的数组和对象后，jQuery应该可以工作

for (let x = 0; x < supervisor.length; x++) {
    $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#' + employee[x].SupervisorID ).append('<li>' + employee[x].DisplayName + '</li>');
}

for（设x=0；x”+主管[x].显示名称+”
>）；
}
对于（设x=0；x'+employee[x].DisplayName+''）；
}

---

工作示例：

您提供的示例数据显示了两个对象数组，而不是两个对象。正如上面@Andreas指出的，您也没有正确地访问数组索引和对象键

更正代码以访问jQuery中的数组和对象后，jQuery应该可以工作

for (let x = 0; x < supervisor.length; x++) {
    $('#myEmployee').append('<li>' + supervisor[x].DisplayName + '<ul id=' + supervisor[x].SupervisorID + '></ul></li>');
}

for (let x = 0; x < employee.length; x++) {                
   $('#' + employee[x].SupervisorID ).append('<li>' + employee[x].DisplayName + '</li>');
}

for（设x=0；x”+主管[x].显示名称+”
>）；
}
对于（设x=0；x'+employee[x].DisplayName+''）；
}

---

工作示例：

您能向我们展示完整的代码吗？您能展示循环到

员工中的示例数据吗？SupervisorID[x]

->

员工[x]。SupervisorID

，

员工[x]

->

员工[x]。ID

@guradio检查我的编辑，我添加了示例数据。@Andreas感谢您指出那个小错误，但是我要问的是，为什么jQuery不能识别我之前附加的ul标签？你能给我们看完整的代码吗？你能展示你循环到

employee.SupervisorID[x]

->

employee[x]的示例数据吗？SupervisorID

，

employee.ID[x]

employee[x]。ID

@guradio检查我的编辑，我添加了示例数据。@Andreas感谢您指出这个小错误，但我要问的是，为什么jQuery不能识别我之前添加的ul标记