removechild 相关问题

从DOM中删除并返回子节点

Todolist:删除动态添加的div

我有一种待办事项列表,在单击“添加”按钮时添加元素。有两条默认行。 add 函数效果很好,这是原始代码 $(函数() { $(".

回答 1 投票 0

无法在“Node”上执行“removeChild”:要删除的节点不是该节点的子节点。使用数据表

我正在使用数据表,这是我的反应代码,每次我进行任何更新时都会出现 Failed toexecute 'removeChild' 如何修复它? 我尝试使用 ChatGPT 和 CaludeAi 但它们都不起作用......

回答 1 投票 0

删除具有指定名称属性的 <input> 标签

我想替换一个字符串,例如: 但我遇到的问题是该值的值(12345)每次都不同......

回答 2 投票 0

如何动态从 Angular 中的 HTML 中删除<script>

我正在尝试将我的应用程序与第三方支付集成。他们提供了我将其包含在 HTML 中的 JS 文件。 var script = document.createElement("script"); 脚本.src = &

回答 1 投票 0

如何动态从 angualr 中的 HTML 中删除 <script>

我正在尝试将我的应用程序与第三方支付集成。他们提供了 js 文件,我将其包含在我的 html 中 var script = document.createElement("script"); 脚本.s...

回答 1 投票 0

(Adobe Animate ActionScript) 如何使用 name、arry 和 lib() 从舞台中删除特定符号?

我对此感到非常沮丧。 首先,让您理解我的代码 - 我的目标是让用户随机选择一个单词,以每个字母都位于盒子内的方式出现在他们面前。 T...

回答 1 投票 0

从 HTML 文档中删除具有特定类的 div 元素

我正在尝试从字符串中删除以下模式: 内容1 其中“Content 1”可能因字符串而异。 以下似乎不起作用: $

回答 2 投票 0

尝试在 javascript 中删除另一个 div 中的 Div

做列表应用程序,但问题是我在删除按钮构建时添加了单击功能,但在功能方面,大多数时候我得到 e 未定义,我检查了所有其他页面,但没有...

回答 1 投票 0

如何删除/忘记第二帧并有条件地重复使用它

尽管有一些编码经验,但那是像 Cobol 一样的“old scole 3GL”,但那是几十年前的事了。不久前,只是为了好玩和好奇,我研究了 4GL 面向对象的 aspec...

回答 1 投票 0

removeChild真的会删除元素吗?

removeChild函数真的能彻底删除子节点吗?或者它只是删除指定父节点的子元素?如果它没有真正删除元素,有没有办法

回答 5 投票 0

python xml 删除孙子或曾孙

我一直在谷歌搜索从 xml 文件中删除孙子。但是,我还没有找到完美的解决方案。 这是我的案例: 第 1 项文本 我一直在谷歌搜索从 xml 文件中删除孙子。但是,我还没有找到完美的解决方案。 这是我的案例: <tree> <category title="Item 1">item 1 text <subitem title="subitem1">subitem1 text</subitem> <subitem title="subitem2">subitem2 text</subitem> </category> <category title="Item 2">item 2 text <subitem title="subitem21">subitem21 text</subitem> <subitem title="subitem22">subitem22 text</subitem> <subsubitem title="subsubitem211">subsubitem211 text</subsubitem> </category> </tree> 在某些情况下,我想删除 subitem。在其他情况下,我想删除subsubitem。我知道我可以在当前给定的内容中这样做: import xml.etree.ElementTree as ET root = ET.fromstring(given_content) # case 1 for item in root.getiterator(): for subitem in item: item.remove(subitem) # case 2 for item in root.getiterator(): for subitem in item: for subsubitem in subitem: subitem.remove(subsubitem) 只有当我知道目标节点的深度时,我才能用这种风格编写。如果我只知道要删除的节点的标签名称,我应该如何实现? 伪代码: import xml.etree.ElementTree as ET for item in root.getiterator(): if item.tag == 'subsubitem' or item.tag == 'subitem': # remove item 如果我这样做root.remove(item),它肯定会返回错误,因为 item 不是 root 的直接子项。 编辑: 我无法安装任何 3rd-party-lib,所以我必须用 xml 来解决这个问题。 我终于通过编写递归函数在 xml lib 上完成了这项工作。 def recursive_xml(root): if root.getchildren() is not None: for child in root.getchildren(): if child.tag == 'subitem' or child.tag == 'subsubitem': root.remove(child) else: recursive_xml(child) 通过这样做,该函数将迭代 ET 中的每个节点并删除我的目标节点。 test_xml = r''' <test> <test1> <test2> <test3> </test3> <subsubitem> </subsubitem> </test2> <subitem> </subitem> <nothing_matters> </nothing_matters> </test1> </test> ''' root = ET.fromstring(test_xml) recursive_xml(root) 希望这可以帮助像我这样有限制要求的人.... 要删除 subsubitem 或 subitem 的实例,无论其深度如何,请考虑以下示例(需要注意的是,它使用 lxml.etree 而不是上游 ElementTree): import lxml.etree as etree el = etree.fromstring('<root><item><subitem><subsubitem/></subitem></item></root>') for child in el.xpath('.//subsubitem | .//subitem'): child.getparent().remove(child) Python 3.10 的更新,因为 getchildren() 不再存在: https://docs.python.org/3/library/xml.etree.elementtree.html#element-objects https://docs.python.org/3/library/xml.etree.elementtree.html#modifying-an-xml-file 请注意,迭代时并发修改可能会导致 问题,就像迭代和修改 Python 列表或 听写。 此脚本将在 3.10 上运行: #!/usr/bin/python import xml.etree.ElementTree as ET def print_xmltree(root): xmlstr = ET.tostring(root, encoding="utf-8", method="xml") print(xmlstr.decode("utf-8")) def recursive_xml(parent, depth): #print(depth * " ", parent.findall('./')) for child in parent.findall('./'): if child.tag == 'subitem' or child.tag == 'subsubitem': parent.remove(child) else: recursive_xml(child, depth + 1) xml_data = """<?xml version="1.0" encoding="UTF-8"?> <tree> <category title="Item 1">item 1 text <subitem title="subitem1">subitem11 text</subitem> <subitem title="subitem2">subitem12 text</subitem> <sibetum title="subitem3">subitem13 text</sibetum> <subsubitem title="subsubitem1">subsubitem211 text</subsubitem> </category> <category title="Item 2">item 2 text <subitem title="subitem1">subitem21 text</subitem> <subitem title="subitem2">subitem22 text</subitem> <subsubitem title="subsubitem1">subsubitem211 text</subsubitem> <sobsobitem title="subsubitem2">wrong tag</sobsobitem> </category> <category title="Item 3">item 3 text </category> </tree>""" #root = ET.parse('test.xml').getroot() # from file root = ET.fromstring(xml_data) # from variable recursive_xml(root, 0) print_xmltree(root) # Note that sobsobitem was forced up in hierachy and that parent tag for subsubitem did not matter (sibetum). wait = input("Press Enter to Exit.") 这将输出: <tree> <category title="Item 1">item 1 text <sibetum title="subitem3">subitem13 text</sibetum> </category> <category title="Item 2">item 2 text <sobsobitem title="subsubitem2">wrong tag</sobsobitem> </category> <category title="Item 3">item 3 text </category> </tree>

回答 3 投票 0

我正在尝试对输入的文件运行删除功能,但没有任何效果

我目前正在为我的 NFT 市场制作前端,并为我的铸币页面创建功能。我创建了一个更新文件元素,允许用户将图像上传到框中

回答 1 投票 0

使用addEventListener移除Child

我刚刚学习javascript。在谷歌 Chrome 控制台上测试东西我最终得到了这个: ... 我刚刚学习javascript。在谷歌 Chrome 控制台上测试东西我最终得到了这个: <html> <head></head> <body> <div id="divi"> <button id="butti">Click Me</button> </div> </body> </html> 还有Js: function cBoton (){ var getDiv = document.getElementById("divi"); getDiv.removeChild(getDiv.lastChild); }; var getButton = document.getElementById("butti"); getButton.addEventListener("click", cBoton); 我希望按钮一点击就被删除。 ¿为什么只有在第二次点击后才起作用? tx! 标记中元素的 .lastChild 是 ""(尝试使用 console.log(getDiv.lastChild) 进行澄清)。 使用它来确保您正在删除所需的元素: function cBoton() { var getDiv = document.getElementById("divi"); getDiv.removeChild(getButton); }; 第一次单击时,divi的最后一个子节点是包含按钮后空格的文本节点,并且该节点将被删除。第二次单击时,该按钮是最后一个子按钮。 无价之宝.. 修改源码; /* .css */ div :nth-child(even){background-color: #f2f2f2} /*.js */ function addDiv() { var para = document.createElement("p"); var node = document.createTextNode('textHere'); // add cell code here para.appendChild(node); var element; element = document.getElementById("div1"); // to add div id recursion element.appendChild(para); } function cBoton (){ var getDiv = document.getElementById("div1"); getDiv.removeChild(getDiv.lastChild); } var getButton = document.getElementById("div1"); getButton.addEventListener("click", cBoton); /* HTML */ <html> <head></head> <body> <button onclick="addDiv()">add</button> <button onclick="cBoton()">Click Me</button> <frameset><legend>recursions</legend> <div id="div1"></div> </frameset> </body> </html> 副驾驶更新! 您的第一个代码片段需要单击两次才能删除按钮的原因是 DOM(文档对象模型)的结构方式。当您第一次加载页面时,ID 为 divi 的 div 元素只有一个子元素,即按钮元素。但是,当您第一次单击按钮时,由于按钮元素后面有空格或换行符,会在 div 内创建一个文本节点(在 DOM 中被视为子节点)。因此,按钮不再是最后一个子节点,文本节点才是。这就是为什么需要点击两次才能删除按钮。 对于您的第二个代码片段,您似乎试图在单击“添加”按钮时向 div 添加一个段落,并在单击“单击我”按钮时删除 div 的最后一个子级。但是,您的代码中有一个错误。您尝试向 div 添加事件侦听器,而不是“Click Me”按钮。这是更正后的版本: function addDiv() { var para = document.createElement("p"); var node = document.createTextNode('textHere'); para.appendChild(node); var element = document.getElementById("div1"); element.appendChild(para); } function cBoton() { var getDiv = document.getElementById("div1"); getDiv.removeChild(getDiv.lastChild); } var getButton = document.getElementById("butti"); // Corrected here getButton.addEventListener("click", cBoton); <html> <head></head> <body> <button id="addButton" onclick="addDiv()">add</button> <!-- Added id here --> <button id="butti" onclick="cBoton()">Click Me</button> <!-- Added id here --> <frameset><legend>recursions</legend> <div id="div1"></div> </frameset> </body> </html> 这应该按预期工作。 “添加”按钮将向 div 添加一个段落,“Click Me”按钮将删除该 div 的最后一个子级。使用 JavaScript 时,请记住始终检查 DOM 的结构和元素的 id。快乐编码!

回答 4 投票 0

当我使用Javascript单击删除按钮时,如何从DOM中删除TODO项目列表?

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>TODO app</title> </head> <script> function deleteDone(id) { console.log("Deleted todo ID:", id); // Delete the right todo from the list // You will need to give each todo an id, and that should be enough to remove it } function deleteTodo(id) { fetch("http://localhost:3000/todos/" + id, { method: "DELETE", headers: { "Content-Type": "application/json" } }).then(deleteDone) } function getTodoscallBack(data){ console.log(data); var parentElement = document.getElementById("mainArea"); // parentElement.innerHTML = JSON.stringify(data); for(var i=0;i<data.length;++i){ var childElement = document.createElement("div"); var grandChildren1 = document.createElement("span"); grandChildren1.innerHTML= data[i].title; var grandChildren2 = document.createElement("span"); grandChildren2.innerHTML= data[i].description; var grandChildren3 = document.createElement("button"); grandChildren3.innerHTML="Delete"; grandChildren3.setAttribute("onclick","deleteTodo("+data[i].id+")"); childElement.appendChild(grandChildren1); childElement.appendChild(grandChildren2); childElement.appendChild(grandChildren3); parentElement.appendChild(childElement); } } function callbackFn2(res){ res.json().then(getTodoscallBack); } function getData(){ fetch("http://localhost:3000/todos",{ method:"GET", }).then(callbackFn2); } getData(); function parsedResponse(data){ console.log(data); var parentElement = document.getElementById("mainArea"); var childElement = document.createElement("div"); var grandChildren1 = document.createElement("span"); grandChildren1.innerHTML= data.title; var grandChildren2 = document.createElement("span"); grandChildren2.innerHTML= data.description; var grandChildren3 = document.createElement("button"); grandChildren3.innerHTML="Delete"; childElement.appendChild(grandChildren1); childElement.appendChild(grandChildren2); childElement.appendChild(grandChildren3); parentElement.appendChild(childElement); } function callback(res){ res.json().then(parsedResponse); } function onPress(){ var title = document.getElementById("title").value; var description = document.getElementById("description").value; console.log(title,"\n",description); fetch("http://localhost:3000/todos",{ method:"POST", body: JSON.stringify({ title: title, description:description }), headers: { "Content-Type": "application/json" } }).then(callback); } </script> <body> Todo title <input type="text" id="title"></input> <br><br> Todo description <input type="text" id="description"></input> <br><br> <button onclick="onPress()">send todo</button> <div id="mainArea"> </div> </body> </html> 在 TODO 项目的删除功能中,我想删除具有给定 id 的特定待办事项,但我在选择父级(即 div 标签)时遇到困难,其中我存储了标题描述和删除按钮,我通过使用 javascript 发送请求来添加该按钮。问题如何使用removeChild()删除具有id的特定删除按钮的div标签?如何做到这一点? 我复制了与您完全相同的代码,并传递了一个伪造的数组来建模待办事项,就像您已经做的那样 const todos = [{ id: 1, title: 'title#1', description: 'description#1' }, { id: 2, title: 'title#2', description: 'description#2' }]; 为了与您的策略保持一致,在创建待办事项的逻辑中,我添加了使用相应的待办事项 id 设置每个删除按钮的 data-id 属性的功能,然后在 deleteDone 函数中我获取了单击的删除使用属性选择器按钮,然后删除使用 div 检索到的整个 closest 容器。 const todos = [{ id: 1, title: 'title#1', description: 'description#1' }, { id: 2, title: 'title#2', description: 'description#2' }]; getTodoscallBack(todos); function deleteDone(id) { console.log("Deleted todo ID:", id); //retrieves the delete button holding the data-id attribute passed const delButton = document.querySelector(`[data-id="${id}"`); //retrieves the element containing that button const todoContainer = delButton.closest('div'); //removes the whole div containing the todo todoContainer.remove(); } function deleteTodo(id) { /* fetch("http://localhost:3000/todos/" + id, { method: "DELETE", headers: { "Content-Type": "application/json" } }).then(deleteDone) */ deleteDone(id); } function getTodoscallBack(data) { console.log(data); var parentElement = document.getElementById("mainArea"); // parentElement.innerHTML = JSON.stringify(data); for (var i = 0; i < data.length; ++i) { var childElement = document.createElement("div"); var grandChildren1 = document.createElement("span"); grandChildren1.innerHTML = data[i].title; var grandChildren2 = document.createElement("span"); grandChildren2.innerHTML = data[i].description; var grandChildren3 = document.createElement("button"); grandChildren3.innerHTML = "Delete"; grandChildren3.setAttribute("onclick", "deleteTodo(" + data[i].id + ")"); //HERE I set the data-id attribute value as data[i].id grandChildren2.dataset.id = data[i].id; childElement.appendChild(grandChildren1); childElement.appendChild(grandChildren2); childElement.appendChild(grandChildren3); parentElement.appendChild(childElement); } } function callbackFn2(res) { res.json().then(getTodoscallBack); } function getData() { fetch("http://localhost:3000/todos", { method: "GET", }).then(callbackFn2); } getData(); function parsedResponse(data) { console.log(data); var parentElement = document.getElementById("mainArea"); var childElement = document.createElement("div"); var grandChildren1 = document.createElement("span"); grandChildren1.innerHTML = data.title; var grandChildren2 = document.createElement("span"); grandChildren2.innerHTML = data.description; var grandChildren3 = document.createElement("button"); grandChildren3.innerHTML = "Delete"; childElement.appendChild(grandChildren1); childElement.appendChild(grandChildren2); childElement.appendChild(grandChildren3); parentElement.appendChild(childElement); } function callback(res) { res.json().then(parsedResponse); } function onPress() { var title = document.getElementById("title").value; var description = document.getElementById("description").value; console.log(title, "\n", description); fetch("http://localhost:3000/todos", { method: "POST", body: JSON.stringify({ title: title, description: description }), headers: { "Content-Type": "application/json" } }).then(callback); } <body> Todo title <input type="text" id="title"> <br><br> Todo description <input type="text" id="description"> <br><br> <button onclick="onPress()">send todo</button> <div id="mainArea"> </div> </body>

回答 1 投票 0

使用RemoveChild()和appendChild()过滤项目

我正在用 Vanilla Javascript 和 CSS 构建一个简单的过滤器。 当用户单击某个类别时,与该类别不相关的文章具有类 .hide。我还需要删除所有这些文章...

回答 1 投票 0

GIF/IMG 未从 DOM 中删除(不是函数?)

所以我正在继续我的测验应用程序,我之前的问题让我深入了解集合如何不能使用 .remove()。我想我的第二个问题是,我最近遇到了几个问题......

回答 1 投票 0

使用php删除Xml数据

如何使用 php 删除 xml 上的特定元素 my.xml 这里 ...

回答 2 投票 0

使用replaceChild时替换多个子节点

我正在调用 API 来生成鸡尾酒列表。有两个列表。第一个是饮料成分表。第二个是饮料测量清单。 我想做的是当我点击我的生成...

回答 1 投票 0

Javascript:无法在“节点”上执行“removeChild”:参数 1 不是“节点”类型

我正在尝试从其中一门课程中重新创建一些实践。它即将从一个 UL 中删除一个 li-item 并将其附加到另一个 UL。 当我按照以下方式编写代码时,一切正常 变量

回答 1 投票 0

我可以用脚本自动检查“用该对象的可继承权限条目替换所有子对象权限条目”吗?

首先,我知道有为此创建的软件,但我试图将其展示给一个严格禁止任何旧应用程序进入环境的企业。我有一个 Powershell s...

回答 0 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.