不使用jQuery如何根据fatherid选择列表项

别担心，这个问题其实很好解决～你之前用getElementById没成功是正常的，因为它只能根据元素的id属性查找单个元素，完全不适合你这种批量查找特定自定义属性的需求。而querySelectorAll其实是正确的工具，只是你可能用错了选择器写法。

直接给你可行的方案：

• 使用CSS属性选择器配合原生的document.querySelectorAll()，就能精准选中所有带有指定fatherid属性的<li>元素。

具体代码示例 #

// 选中所有fatherid为"1"的li元素
const targetListItems = document.querySelectorAll('li[fatherid="1"]');

如何操作选中的元素 #

拿到选中的元素集合后，你可以用forEach遍历它们，做任何你需要的操作：

// 遍历并处理每个选中的列表项
targetListItems.forEach(item => {
  // 示例：给元素添加高亮样式
  item.classList.add('highlight');
  // 或者获取元素内容
  console.log('选中的项内容：', item.textContent);
});

动态指定fatherid的情况 #

如果你的目标fatherid是动态生成的（比如存在变量里），可以用模板字符串拼接选择器：

const targetFatherId = "1"; // 这里可以是任意动态值
const targetListItems = document.querySelectorAll(`li[fatherid="${targetFatherId}"]`);

小提醒 #

要注意选择器里的属性名要和HTML里的完全一致（比如你的HTML里是fatherid，就不能写成FatherId或者其他变体），否则会匹配不到元素哦。

内容的提问来源于stack exchange，提问作者Lorenzo Cutrupi