Question

我遇到了removeChild方法的问题。浏览器给我一个类型错误。

这是我的代码：

HTML

<header>
    <div id="header-div">
        <img id="logo-image" src="img.jpg" alt="image">
    </div>
    <div class="mobile-hamburger">
        <a href="#menu" class="box-shadow-menu">text</a>
    </div>
</header>

JS

var windowWidth = parseInt(window.innerWidth);

if (windowWidth >= 700) {

let headerTag = document.getElementsByTagName("header");
let hamburgerMenu = document.getElementsByClassName("mobile-hamburger");

hamburgerMenu.headerTag.removeChild(hamburgerMenu);

}

我在窗口宽度为1920px时进行测试。我还可以看到浏览器在调试工具中抓取<header>标记和<div>类"mobile-hamburger"类。所以他们很好。

我无法在removeChild行找到问题。我在调用其父元素后删除了一个元素。

以下是此代码的解释：https://jsfiddle.net/u3r9m5f0/

Answer 1

document.getElementsByTagName和document.getElementsByClassName返回类似于对象的节点列表。您需要在第一个索引处获取元素。

您还有parent.removeChild(child)错误

的语法

var windowWidth = parseInt(window.innerWidth);

if (windowWidth >= 700) {

  let headerTag = document.getElementsByTagName("header")[0];
  let hamburgerMenu = document.getElementsByClassName("mobile-hamburger")[0];

  headerTag.removeChild(hamburgerMenu);

}

尽管从父母那里调用，removeChild仍无法正常工作

1 个答案: