问题标签 [clonenode]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - 如何附加一个带有标签的圆圈以指示矩形节点的信息并在下载前删除圆圈
我有一个垂直的 D3JS 树,其中节点是矩形。我想在矩形节点的右上角附加一个带有斜体字母“ i ”的圆圈,以表明该节点有附加信息。我设法只附加了斜体字母“i”,但是,我无法将它放在一个圆圈中并且仍然保持节点可点击。此外,我使用克隆将树下载为 SVG 文件,并希望在下载和打印之前从克隆的组元素中删除这个附加的圆圈和字母“ i ”。
javascript - OSX 上的 Chrome:CSS 过渡立即应用于 div 的第二个克隆
我想做以下事情:创建一个 div (#test),然后多次克隆该 div,每次克隆它时都会通过 javascript 添加一个 css 转换。第一次一切正常,但如果我尝试第二次克隆并应用 css 过渡,则过渡不起作用。
在此示例中(https://jsfiddle.net/9uL1qt6n/13/),红色方块按预期移动,但绿色方块没有移动,并立即出现在过渡结束时。
这是我正在使用的 javascript 代码:
我期望红色方块在 0.5 秒时以 left=0px 开始并向右移动,然后是在 0.75 秒时以 left=0px 开始并向右移动的绿色方块。我看到的是一个红色方块,在 0.5 秒处以 left=0px 开始并向右移动,然后是一个在 0.75 秒处以 left=500px 开始并且不移动的绿色方块。
编辑:这似乎在 Mac 上的 Safari 以及 iOS 中的 Safari 和 Chrome 上正常工作。以上建议的行为仅出现在 Mac 上的 Chrome 上。
javascript - 尝试在 for 循环中运行 jQuery.clone() 以附加元素 x 次,但获得的输出超出预期
期望的输出:
相反,我得到了更多的元素,将近 20 个。我是 jQuery 和学习的新手。我查看了 jQuery.each() 但似乎该方法适用于数组+对象。
另外,我正在使用 jQuery,因为我需要将 eventListeners 附加到所有克隆的元素,并且事件委托是不可能的,因为这些元素不在 parentContainer 中。
我目前也在测试是否可以使用带有 cloneNode() 的常规 for 循环来附加我的元素,然后可能使用 jQuery.each() 来附加 eventListeners?
javascript - 无法通过 id 复制和重命名元素
为清楚起见,编辑显示所有代码。我现在遇到的问题是在复制字段时保留 ui 输入类,就像我在保留格式之前克隆它的方式一样,但没有以我能够在克隆时正确重构 id 的方式进行复制。它要求我提供更多细节,但我认为仅此而已。哦,我还需要在每次添加的末尾添加一个中断以进行正确的格式设置,但我还没有解决这个问题。
javascript - Textarea 在 .reset() 上给出数字 0
我创建了一个带有 texareas 的表单,它以另一个禁用 texareas 的表单显示 texarea 的输入。我创建了一个克隆两个表单的函数,并.reset()
在单击按钮时在两个表单上添加了一个。
我有一个问题,显示输出的表单(禁用的文本区域)显示 0 而不是在第一个表单正确重置时被清除。我无法弄清楚问题是什么,所以我希望能得到一些帮助。
我的代码如下:
请参阅此处的示例:jsfiddle
javascript - 重置日期输入类型,输入显示在禁用的文本区域上并附加在之后
我有一个表单,一侧带有输入字段,另一侧带有禁用的输入字段,显示来自其相应输入字段的值。我还可以选择使用一个按钮克隆这些表格,该按钮可以同时克隆两侧,其中之一是教育,因此可以进行多种教育等。
除了日期输入和输出字段外,一切正常,如果我使用.reset()
或document.getElementById("myid").value = "";
在它们上输出停止工作,它只是保持空白。即使我不重置它们,克隆后日期选择器也会停止工作。
这是我的这部分表单的 javascript 代码
这就是我重置显示日期的输出 texareas 时发生的情况:JSFiddle
任何人都知道如何正确重置输出日期字段或我哪里出错了?
javascript - 有没有办法为通过克隆节点创建的项目分配唯一 ID?
我正在根据浏览器窗口的大小创建一个网格。javascript 正确构建了网格,但是我无法定位单个元素,因为没有一个元素带有 ID 类。有没有办法在“克隆”时分配它?
正文包含以下内容,克隆以列表类为目标。每个列表类中都有一个 div 类,其中有一个由 CSS 生成的圆圈。理想情况下,我将能够同时定位列表类和其中的 div 类。
这是我想在构建网格时自动生成唯一 ID 的 javascript。
非常感谢任何帮助。已经尝试和搜索了很长一段时间,但似乎无法工作/找到解决方案。
谢谢,
抢
web-component - 为什么使用的时候需要用到cloneNode with Shadow Dom
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the d
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
Moving a div inside a container from edge to edge
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the d
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
Moving a div inside a container from edge to edge
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
I've been looking around the mdn documents about web component,I followed the link and i arrived to documents about template below the link is what i was looking.
According to the documents
it says if i don't append node by using cloneNode? template's inner style will does not work. But i try both just append and append with cloneNode but both test was same.... So i have a question that am i miss understanding or spec changes to support both? i test both browser in chrome , safari
code with out cloneNode
code using cloneNode
https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_templates_and_slots
I'm trying to make a div (shapped like a bar) move inside of a container (infinite loop, back and forth).
You can find the codepen here: https://codepen.io/riza-khan/pen/wvzLRPW?editors=0010
I just can't seem to find the correct method to do so.
I used getBoundingClientRect()
to get the position of the parent element and tried to tie the position of the bar to its parents left and right values, but that doesn't seem to work. It bobbles back and forth in the middle of nowhere.
Basically the intended results are that the bar moves from one edge to the other edge of its container element (but never leaves the container).
Thank you,
javascript - 通过原始 DOM 引用元素查找克隆元素
我有一个<template>
有几个子元素。我通过克隆这些子元素.cloneNode(true)
并将它们附加到document.head
.
我想要的是
有没有办法在任何给定时刻判断是否document.head
已经包含<template>
内容?
我试过的
- 维护标志例如
template.setAttribute('data-cloned', 1)
有效,但这是一种解决方法 document.head.contains()
不起作用可能是因为克隆的元素在内部是不同的:- 循环遍历每个模板元素与内部的每个元素
document.head
,并使用 , 比较它们.is()
,否则它们.outerHTML
似乎不是很有效。
我现在正在使用 flag 属性,但我很想知道是否有一种方法可以通过仅使用模板内容和document.head
不创建属性或 className 混乱和/或额外修改它们来完成此操作。只要可能且合理,我想避免依赖 jQuery。