当前位置：
  1. 首页
  2. 前端开发
  3. JavaScript
  4. 正文

JavaScript 中 TypeError: removeClass is not a function 错误

JavaScript 437

出现“TypeError: removeClass is not a function”错误的原因有多种：

  • 在不是一组 jQuery 元素的值上调用函数。
  • 拼写错误的 removeClass（区分大小写）。
  • 将 JS 脚本标记放在声明 DOM 元素的 HTML 代码之上。
  • 在同一页面上多次加载 jQuery。

下面是产生上述错误的示例

const box = document.getElementById('box');

// ⛔️ Uncaught TypeError: box.removeClass is not a function
box.removeClass('blue');

我们在 DOM 元素而不是一组 jQuery 元素上调用了 removeClass 方法。

要解决“removeClass is not a function”错误，请确保在声明 DOM 元素并加载 jQuery 后，对一组 jQuery 元素调用 removeClass 方法并将 JS 脚本标记放在 body 标记的底部 。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>

  <body>
    <div id="box" class="blue">Box</div>

    <!-- ✅ load jQuery ✅ -->
    <script
      src="https://code.jquery.com/jquery-3.6.0.min.js"
      integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
      crossorigin="anonymous"
    ></script>

    <!-- ✅ Your JS script here ✅ -->
    <script src="index.js"></script>
  </body>
</html>

请注意 ，我们在 body 标记的底部加载了 jQuery 和我们自己的脚本 (index.js)。

顺序很重要，因为如果我们在声明 div 之前加载脚本，我们将无法访问 index.js 文件中的元素。

这是 JS 文件的代码。

const box = $('#box');

console.log(box); // 👉️ [div#box]

// ✅ works
box.removeClass('blue');

我们使用 jQuery 函数选择 id 为 box 的元素，并使用 removeClass 方法从中删除蓝色类。

如果我们选择了多个元素，例如 使用类选择器，我们将从所有匹配的元素中删除该类。

例如，如果我们有以下 DOM 元素：

<div class="box blue">Box 1</div>
<div class="box blue">Box 2</div>
<div class="box blue">Box 3</div>

并选择了具有 box 类的元素：

const box = $('.box');

console.log(box); // 👉️ [div.box, div.box, div.box]

box.removeClass('blue');

removeClass 方法从类名为 box 的每个 DOM 元素中删除类。

如果错误仍然存在，请确保您正确拼写了 removeClass，因为它区分大小写。

我们加载脚本的顺序很重要。

我们只需加载 jQuery 脚本一次，并确保在运行 JavaScript 代码之前加载它。

如果我们的代码在加载 jQuery 之前运行，则我们无法在代码中使用 jQuery 提供的任何功能。

总结

**要解决“removeClass is not a function”错误，请确保在声明 DOM 元素并加载 jQuery 后，对一组 jQuery 元素调用 removeClass 方法并将 JS 脚本标记放在 body 标记的底部 ** 。

上一篇 JavaScript 中 TypeError: toUTCString is not a function 错误
下一篇 JavaScript 中 TypeError: form.submit is not a function 错误

相关文章