我正在页面中克隆一个textarea,但克隆的元素没有任何主要元素的事件,有没有办法克隆克隆元素中的所有事件?
var dupNode = node.cloneNode(deep);
Run Code Online (Sandbox Code Playgroud) 执行以下代码时,IE会抛出错误 - 对象不支持此属性或方法 - 引用cloneNode()方法.'i'是循环计数器,source和dest都是HTML select元素.
dest.options[dest.options.length] = source.options[i].cloneNode( true );
Run Code Online (Sandbox Code Playgroud)
FF和Chrome的行为符合预期.关于如何让IE执行cloneNode()的任何想法?IE 8调试器显示source.options [i]确实有cloneNode()方法.
谢谢.
我有一个包含多行输入的表单元素.将每一行视为我想在Web应用程序中创建的新对象的属性.而且,我希望能够在一个HTTP POST中创建多个新对象.我正在使用Javascript的内置cloneNode(true)方法来克隆每一行.问题是每个输入行还有一个附加到其onclick事件的删除链接:
// prototype based
<div class="input-line">
<input .../>
<a href="#" onclick="$(this).up().remove();"> Remove </a>
</div>
Run Code Online (Sandbox Code Playgroud)
单击克隆的输入行的删除链接时,它还会删除从同一个dom对象克隆的所有输入行.在上面的DOM元素上使用cloneNode(true)后,是否可以将"this"对象重新绑定到正确的锚标记?
我正在 XML DOM 对象中构建 HTML 代码,以用作使用 XSL 模板的 div 元素的 innerHTML 的内容。传统上,我们创建一个新的 XML DOM 文档,并将输入参数添加为 XML 元素,以便通过 javascript 进行转换。这非常耗时,因为我们基本上是从代表我们当前帐户的另一个 XML 文档中手动选取数据,并将数据复制到瞬态 XML DOM 文档中。
我想做的是克隆帐户文档的相关节点(即客户信息)并将其用作转换的基础。我不想直接使用帐户文档,因为我希望能够添加转换特定输入,而不对帐户对象进行更改。
对于通常包含 2000 多个元素的文档中通常少于 200 个元素的所需节点,使用 .cloneNode(true) 的效率如何?目标平台是IE6,没有外部工具(即ActiveX)。
我对jQuery $.clone
和raw .cloneNode
属性之间的区别感到有点困惑.
如果我在做
$('blah').cloneNode(true)
这将在jQuery空间之外创建一个全局对象.
如果我使用
$('blah').clone(true)
这将在jQuery空间内创建一个jQuery对象,但复制包括事件在内的所有内容?
如果我使用jQuery应该坚持,.clone
如果我改变我的代码.cloneNode
将有任何影响?
这与javascript cloneNode和属性的问题有关.
我看到了同样的行为.Node.cloneNode不会复制我自己添加的任何属性(来自原始帖子的代码):
var theSource = document.getElementById("someDiv")
theSource.dictator = "stalin";
var theClone = theSource.cloneNode(true);
alert(theClone.dictator);
Run Code Online (Sandbox Code Playgroud)
theClone
不包含任何属性"独裁者".
我无法找到任何解释为什么会这样.MDN上的文档声明cloneNode
"复制其所有属性及其值",这一行直接取自DOM规范本身.
这似乎打破了我,因为它几乎不可能做包含自定义属性的DOM树的深层副本.
我在这里错过了什么吗?
我克隆了一个节点,但我想设置或更改一个div的属性,它克隆节点内,具体而言,改变id
的div id="test0"
我找不到任何关于此的文档,任何直接的JavaScript人都知道解决方案吗?
var c = document.getElementById("stone-opt0"),
cloned = c.cloneNode(true);
//CODE THAT DOESN'T WORK
cloned.getElementById("test0").id = "new-id";
Run Code Online (Sandbox Code Playgroud)
我正在做的是循环一个大的项目列表,并将这些项目放入一个文档片段,然后我将其推送到页面...我这样做而不是将每个元素添加到页面,然后在附加后修改到DOM(哪个更快,没有?)
在Angular2中,在某些情况下,我需要复制节点而不是移动它。该节点具有angular2属性,因此cloneNode不起作用。我该怎么做?
*什么不起作用
let el = <HTMLElement>document.getElementById(divId);
if ((<HTMLElement>el.parentNode).id == 'itsMe')
el = <HTMLElement>el.cloneNode(true);
document.getElementById(anotherId).appendChild(el);
Run Code Online (Sandbox Code Playgroud)
*什么工作有效,来自Angular2:克隆组件/ HTML元素及其功能
@Component({
selector: 'my-app',
template: `
<template #temp>
<h1 [ngStyle]="{background: 'green'}">Test</h1>
<p *ngIf="bla">Im not visible</p>
</template>
<template [ngTemplateOutlet]="temp"></template>
<template [ngTemplateOutlet]="temp"></template>
`
})
export class AppComponent {
bla: boolean = false;
@ContentChild('temp') testEl: any;
}
Run Code Online (Sandbox Code Playgroud)
但是如何动态添加模板?
我在一些代码示例中注意到克隆 DOM 节点并将其附加到现有元素的看似不同的方法:
element.appendChild(something.cloneNode(true));
element.appendChild(document.importNode(something, true));
Run Code Online (Sandbox Code Playgroud)
两者都有复制节点的效果。第二个版本似乎更冗长,暗示副本实际上首先是具体的某个地方,尽管它仍然需要找到一个合适的家。但是,它被 MDN 和其他一些用作使用template
标签的说明。在其他地方,他们会选择更简单的clodeNode
选项。
问题是:使用importNode
over 有cloneNode
什么好处?
下面的代码按预期工作。
克隆节点.js
<!DOCTYPE html>
<html>
<body>
<script src="../js/CloneNode.js">
function myFunction(){
var the_node = document.getElementById("myList").lastChild;
var the_clone = the_node.cloneNode(true);
document.getElementById("myList").appendChild(the_clone);
}
</script>
<ul id="myList">
<li>Good morning</li>
<li>Hello</li></ul>
<p>Click on the button to CloneNode()</p>
<button onclick = "myFunction()">Copy it!</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
它也适用于以下代码:
<ul id="myList"><li>Good morning</li>
<li>Hello</li></ul>
Run Code Online (Sandbox Code Playgroud)
或者
<ul id="myList"><li>Good morning</li><li>Hello</li></ul>
Run Code Online (Sandbox Code Playgroud)
但是当我之前</ul>
在上面的 HTML 代码中输入换行符时,如下所示,我没有得到输出。因此,<li>
网页上没有添加元素。
<ul id="myList">
<li>Good morning</li>
<li>Hello</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
HTML 代码中的缩进如何影响输出?或者有什么我错过的吗?
我必须更改XML的"未知"内容.结构和内容本身是有效的.原版的
<blabla foo="bar">
<aa>asas</aa>
<ff>
<cc>
<dd />
</cc>
</ff>
<gg attr2="2">
</gg>
...
...
</blabla>
Run Code Online (Sandbox Code Playgroud)
变
<blabla foo="bar">
<magic>
<aa>asas</aa>
<ff>
<cc>
<dd />
</cc>
</ff>
<gg attr2="2">
</gg>
...
...
</magic>
</blabla>
Run Code Online (Sandbox Code Playgroud)
因此,在文档根节点(document.documentElement)下直接添加子项并在其下"推送""原始"子项.这里必须用普通的javascript(ecmascript)来完成.
现在的想法是
// Get the root node
RootNode = mymagicdoc.documentElement;
// Create new magic element (that will contain contents of original root node)
var magicContainer = mymagicdoc.createElement("magic");
// Copy all root node children (and their sub tree - deep copy) to magic node
/* ????? here …
Run Code Online (Sandbox Code Playgroud) clonenode ×11
javascript ×9
dom ×5
clone ×3
xml ×2
angular ×1
events ×1
html ×1
jquery ×1
ng-template ×1
properties ×1
prototypejs ×1