如何用JavaScript获取PHP动态生成的无ID/名称复选框状态？

核心思路：直接操作DOM元素获取实时状态 #

不要通过innerHTML获取静态HTML，而是直接遍历目标容器内的DOM元素，这样才能拿到复选框的实时选中状态。

1. 获取目标容器下的所有列表项

   const listContainer = document.getElementById("myList");
   const liItems = listContainer.querySelectorAll("li");
   

2. 遍历处理每个列表项
   循环每个<li>，找到里面的复选框，判断选中状态后构造目标格式的字符串：

   let processedHtml = "";
   liItems.forEach(li => {
     const checkbox = li.querySelector("input[type='checkbox']");
     const itemText = li.textContent.trim();
     const statusTag = checkbox.checked ? "(checked)" : "(not checked)";
     processedHtml += `<li>${statusTag} ${itemText}</li>`;
   });
   

3. 将处理后的数据发送到PHP
   用fetch发起POST请求即可（也可以用传统的XMLHttpRequest）：

   fetch('your-php-file.php', {
     method: 'POST',
     headers: {
       'Content-Type': 'application/x-www-form-urlencoded',
     },
     body: `processedList=${encodeURIComponent(processedHtml)}`
   })
   .then(res => res.text())
   .then(resData => {
     // 处理PHP返回的结果，比如提示提交成功
     console.log(resData);
   });
   

关键提醒 #

• 避免用innerHTML获取内容：它是页面加载时的静态快照，无法反映复选框的实时选中状态，直接操作DOM才能拿到当前的真实状态。
• 若列表项内的文本和复选框位置有变动，textContent.trim()依然能准确提取纯文本内容，兼容性更强。

内容的提问来源于stack exchange，提问作者Mr.Yelloish