javascript - 不使用 java 脚本中的 id 元素执行追加操作

Question

我想看看是否有一种方法可以在不定义元素ID或不使用属性的情况下定义第二个div，并在其中执行附加操作，例如说p元素应该附加在第二个不使用 id 的 div 和任何其他属性，让我们提到第二个 div。

• 更多细节在代码中 *

   function createEle() {
          var c = document.createElement('p');
          // In this section, I want to point to that div and use append without using an ID or any other   attribute
          return ?
        }
        createEle();

      <section>
        <div>
          <div>I want the p tag to be appended in this div</div>
        </div>
      </section>

标签： javascripthtml

Answer 1

您可以改用选择器字符串，仅使用标签名称。例如section > div > div，将选择嵌套的 div（它将选择一个 div，它是一个 div 的子级，它是一个节的子级）：

function createEle() {
  const inner = document.querySelector('section > div > div');
  inner.appendChild(document.createElement('p')).textContent = 'foo';
}
createEle();

<section>
  <div>
    <div>I want the p tag to be appended in this div</div>
  </div>
</section>