Question

var divElement = document.createElement("div");
divElement.setAttribute('id', 'Items');

var ulElement = document.createElement("ul");
var liElement = document.createElement("li");
var spanElement1 = document.createElement("span");
var spanElement2 = document.createElement("span");
liElement.appendChild(spanElement1);
liElement.appendChild(spanElement2);
ulElement.appendChild(liElement);

当我进入选择器查询时，我无法获取元素。

document.querySelectorAll（＆＃34; divElement ul li＆＃34;）; 应该给予
document.querySelectorAll（＆＃34; #Items ul li＆＃34;）;

但它不起作用，如何在运行时获取id ????

Answer 1

终于想出了解决方案。我们可以使用 getElementById 从用户那里获得＆＃34; id＆＃34; ，然后轻松应用 查询选择

document.getElementById（id）.querySelectorAll（＆＃39; ul li＆＃39;）;

Answer 2

如果您仍然无权访问divElement.querySelectorAll('ul li')或divElement，请使用document.querySelectorAll('div ul li')。

注意没有点。 .用于CSS中的类。对于元素，您只需使用标记名称。

divElement是您在JS中创建的元素的引用，但其CSS选择器为div而不是divElement。 JS名称变量不能在选择器字符串中使用。

关于主题querySelectorAll doc和how css selectors work

的良好阅读

Answer 3

您需要先学习querySelectorAll

基本语法

elementList = document.querySelectorAll(selectors);

在你的情况下

elementList = document.querySelectorAll(div ul li);

这里有用links

Answer 4

您可以通过id获取元素，然后使用查询选择器，如下所示： console.log(document.getElementById('details').querySelectorAll('ul li'))

<ul id="details"> == $0
    <li>
      <span>
         <label>TEST</label>
         <p>GEORGE</p>
        </span>
    </li>
    <li>
      <span>
        <label>TEST_TWO</label>
        <p>2131</p>
          </span>
    </li>
  </ul>

如何使用queryselector获取标签内的元素？

4 个答案: