通过类名删除元素

2023-11-23

我有下面的代码来查找具有类名的元素:

// Get the element by their class name
var cur_columns = document.getElementsByClassName('column');

// Now remove them

for (var i = 0; i < cur_columns.length; i++) {
      
}

Do I have参考父母之类的?处理这个问题的最佳方法是什么?

这是JS:

var col_wrapper = document.getElementById("columns").getElementsByTagName("div");
var len = col_wrapper.length;

alert(len);

for (var i = 0; i < len; i++) {
    if (col_wrapper[i].className.toLowerCase() == "column") {
        col_wrapper[i].parentNode.removeChild(col_wrapper[i]);
    }
}

这是 HTML:

<div class="columns" id="columns">
    <div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
    <div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
    <div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
    <div class="column"><input type="checkbox" name="col_list[]" value="cows">cows</div>
    <div name="columnClear" class="contentClear" id="columnClear"></div>
</div>

如果您不想使用 JQuery:

function removeElementsByClass(className){
    const elements = document.getElementsByClassName(className);
    while(elements.length > 0){
        elements[0].parentNode.removeChild(elements[0]);
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

通过类名删除元素 的相关文章

  • 将 OoXml 插入单词抛出错误:未知

    我一直在尝试通过office js将OOXML插入到word文档的正文内容中insertOoXML 方法 我什至尝试过最简单的实现 认为我在尝试替换 XML 本身中的 fieldCodes 时做了一些不正确的事情 所有结果都是这样Error
  • JavaScript onTouch 不工作

    谁能告诉我为什么这个 onTouch 处理程序没有触发 var myDiv document getElementById existingContent var myButton a href log out a myDiv append
  • 在 javascript/jquery 中将光标更改为等待

    当调用函数时 如何让光标更改为此加载图标以及如何将其更改回 javascript jquery 中的普通光标 在你的 jQuery 中使用 body css cursor progress 然后又恢复正常 body css cursor d
  • 从数据 URI 解码 QR 码

    我尝试从数据 uri 中解码二维码 var dataUri data image gif base64 R0lGODdh9gD2AIAAAAAAAP ywAAAAA9gD2AAAC decodeQrCode dataUri cb 我已经尝试
  • 不和谐机器人 |不和谐.js |类型错误:无法读取未定义的属性“长度”

    我正在制作一个 Discord 机器人 并且正在使用 CodeLyon 的视频作为参考 该错误位于我的 message js 文件中 该文件包含以下内容 require dotenv config create cooldowns map
  • jQuery AJAX 调用 Java 方法

    使用 jQuery AJAX 我们可以调用特定的 JAVA 方法 例如从 Action 类 该 Java 方法返回的数据将用于填充一些 HTML 代码 请告诉我是否可以使用 jQuery 轻松完成此操作 就像在 DWR 中一样 此外 对于
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 如何抑制窗口鼠标滚轮滚动...?

    我正在开发嵌入页面中的画布应用程序 我有它 因此您可以使用鼠标滚轮放大绘图 但不幸的是 这会滚动页面 因为它是文章的一部分 当我在 dom 元素上滚动鼠标滚轮时 是否可以阻止鼠标滚轮在窗口上滚动 附加鼠标滚轮 不是 Gecko DOMMou
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • Jquery/Javascript 上传和下载文件,无需后端

    是否可以在没有后端服务器的情况下在 JavaScript 函数中下载和上传文件 我需要导出和导入由 JavaScript 函数生成的 XML 我想创建按钮 保存 xml 来保存文件 但我不知道是否可行 另一方面 我希望将 XML 文件直接上
  • 使用 KnockoutJs 映射插件进行递归模板化

    我正在尝试使用以下方法在树上进行递归模板化ko映射 插入 http knockoutjs com documentation plugins mapping html 但我无法渲染它 除非我定义separate每个级别的模板 在以下情况下
  • Meteor - 从客户端取消服务器方法

    我正在通过服务器方法执行数据库计数 用户可以选择他们希望如何执行计数 然后调用该方法 我的问题是 计数可能需要一些时间 并且用户可能会在方法运行时改变主意并请求不同的计数 有什么方法可以取消调用的方法并运行新的计数吗 我认为 this un
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • 提交表单并重定向页面

    我在 SO 上看到了很多与此相关的其他问题 但没有一个对我有用 我正在尝试提交POST表单 然后将用户重定向到另一个页面 但我无法同时实现这两种情况 我可以获取重定向或帖子 但不能同时获取两者 这是我现在所拥有的
  • Electron - 为什么在关闭事件时将 BrowserWindow 实例设置为 null

    The 电子文档 https electronjs org docs api browser window 提供以下代码示例来创建新窗口 const BrowserWindow require electron let win new Br
  • Javascript 数组到 VBScript

    我有一个使用 Javascript 构建的对象数组 我需要使用 VBScript 读取它 如下例所示 我找不到在 VbScript 代码中循环遍历数组的方法myArray object 这个例子是我的问题的简化 我无法更改页面的默认语言 这
  • 为什么在 Internet Explorer 中访问 localStorage 对象会引发错误?

    我正在解决一个客户端问题 Modernizr 意外地没有检测到对localStorageInternet Explorer 9 中的对象 我的页面正确使用 HTML 5 文档类型 并且开发人员工具报告该页面具有 IE9 的浏览器模式和 IE
  • 如何获取给定 DOM 元素的所有定义的 CSS 选择器?

    如何使用 jQuery 获取给定 DOM 元素的所有定义的 CSS 选择器 定义后 我的意思是在应用于任何样式表的所有 CSS 选择器document 在某种程度上 这类似于 FireBug 实现的功能 其中显示所选 DOM 元素的所有应用
  • 条件在反应本机生产中失败,但在开发中有效

    我创建了一个反应本机应用程序 我需要通过它进行比较 如果属实 就会执行死刑 问题是 该条件适用于 React Native 开发模式 而不适用于 React Native 生产版本 我使用 firebase 作为数据库 也使用 redux
  • 为什么 jquery 没有检测到单选按钮未被选中的情况? [复制]

    这个问题在这里已经有答案了 可能的重复 JQuery radioButton change 在取消选择期间不会触发 https stackoverflow com questions 5176803 jquery radiobutton c

随机推荐

  • C# 5 的“即发即忘”中的异常处理(在 .net 4.5 中)

    考虑以下 一劳永逸 用例 调用者从我的方法请求一些数据 我的方法检查缓存以查看数据是否已经存在 如果不是 它会从源中获取并缓存它 调用者在获取结果之前不需要等待缓存发生 并且如果缓存失败 该方法不应阻止调用者获取结果 我今天所拥有的 看起来
  • 为什么我的 Python 代码为列表中的所有元素提取相同的数据?

    My project consists of making a competitive watch table for hotel rates for an agency It is a painful action that I want
  • 如何查找给定列是否存在唯一键约束

    我正在编写一个 perl 脚本 我需要在其中运行更新查询 但我需要检查 update sql 命令是否不违反唯一键约束 所以如果我有一张桌子tb C1 C2 C3 我的更新查询如下 update tb set C1 b1 where C2
  • 如何在HTML中正确引用本地资源?

    事实证明 引用本地资源可能是一些人的摩擦点 我正在寻找本地资源引用的规范答案及其含义 拿这些例子来说 这些参考路径有什么区别呢 img src myfile png 没有前导斜杠 img src myfile png 带有前导斜杠 img
  • 为什么 n+++n 有效而 n++++n 无效?

    在Java中 表达式 n n 似乎评估相当于 n n 尽管事实上 n是一个有效的一元运算符 其优先级高于算术运算符 运算符在n n 因此编译器似乎假设该运算符不能是一元运算符并解析该表达式 然而 表达式 n n 无法编译 即使有一个有效的可
  • Facebook在iOS6.0中使用SLRequest上传照片无论如何失败

    这是我的 Objc 代码 ACAccountStore facebookaccount ACAccountStore alloc init ACAccountType facebookaccountType facebookaccount
  • 电子邮件附件

    我希望能够附加我生成的文件 即时 我不想将文件保存在我的服务器上 并通过电子邮件发送出去 我已完成所有文本 但不知道如何使用 sendmail 将文件附加到电子邮件 谢谢 See http railscasts com episodes 2
  • Android: onPause() 是否保证在 finish() 之后调用?

    在任何地方都找不到对此问题的可靠答案 我有一个方法 其中调用 finish 然后调用 onPause onPause 是否保证在调用 finish 后被调用 Android一般会调用onPause 如果你打电话finish 在您的 Acti
  • SSL:使用 Python3 的 CERTIFICATE_VERIFY_FAILED

    如果这是一个愚蠢的问题 我深表歉意 但我一直在尝试自学如何使用 BeautifulSoup 以便我可以创建一些项目 我按照此链接作为教程 https www youtube com watch v 5GzVNi0oTxQ 在遵循与他完全相同
  • Android 进程内存使用与电池消耗之间的相关性

    我终于找到了一种获取各个进程的 TotalPss 的方法 现在我关心的是 如何找到每个android进程的电池消耗 如果没有直接的方法找到它 每个进程的内存使用量和电池消耗之间是否有任何相关性 我可以为此研究任何研究论文吗 是的 内存使用量
  • VBScript 内存不足错误

    我有一个由第三方公司构建的经典 ASP CRM 目前 我可以访问源代码并能够进行所需的任何更改 一天中 通常是在用户长时间使用之后 我的大多数页面都会随机出现内存不足错误 应用程序的构建方式是所有页面和脚本都从 Global asp 文件中
  • 为什么服务器重置 TCP 后用户代理会重新提交请求?

    我们最近注意到一个问题 即某些用户代理会重复相同的 POST 请求 而用户实际上并没有实际触发它两次 经过进一步研究 我们注意到只有当请求通过负载均衡器并且服务器花了很长时间来处理请求时才会发生这种情况 数据包捕获会话最终显示负载均衡器在
  • 是否有针对受最大宽度或最大高度约束的 IMG 的 CSS 选择器?

    如果我定义以下 CSS 规则 img max width 200px max height 200px border 1px solid black 是否有一种纯 CSS 方法来检测那些在没有尺寸限制的情况下会更大的图像对象 语义上匹配的东
  • 是否可以使用结构化绑定来分配类成员?

    我想使用 C 17 结构化绑定为类成员变量赋值 如下所示 include
  • 使用 Python 从 HTML 文件中提取文本

    我想使用 Python 从 HTML 文件中提取文本 如果我从浏览器复制文本并将其粘贴到记事本中 我想要的输出基本上与我得到的输出相同 我想要比使用正则表达式更强大的东西 因为正则表达式可能会在格式不良的 HTML 上失败 我看到很多人推荐
  • 我们如何将 UISplitVIewController 推送到 UINavigationController

    是否可以将 SplitViewController 推送到导航控制器上 我收到此错误 Split View Controllers cannot be pushed to a Navigation Controller
  • 如何在 MySQL 数据库中存储 Emoji 字符

    我有一个配置了默认排序规则的 MySQL 数据库utf8mb4 general ci 当我尝试使用以下查询在文本中插入包含表情符号字符的行时 insert into tablename column1 column2 column3 col
  • Javascript 减少陷阱 - 跳过第一次迭代?

    为什么javascript的reduce实现在第一次迭代时会跳过执行 1 2 3 reduce acc val gt console log acc acc console log val val return acc val acc 1
  • Switch-Case:声明初始化和声明然后赋值

    在 switch case 语句中声明与初始化无效但是声明然后赋值被允许 如下面的代码片段所示 从编译器方面来看 这两种类型的初始化有什么区别 为什么第一种类型的初始化无效而第二种类型的初始化有效 switch val case 0 int
  • 通过类名删除元素

    我有下面的代码来查找具有类名的元素 Get the element by their class name var cur columns document getElementsByClassName column Now remove