标签: clonenode

克隆元素及其所有事件

我正在页面中克隆一个textarea,但克隆的元素没有任何主要元素的事件,有没有办法克隆克隆元素中的所有事件?

var dupNode = node.cloneNode(deep);
Run Code Online (Sandbox Code Playgroud)

javascript clonenode javascript-events

16
推荐指数
1
解决办法
1万
查看次数

Internet Explorer中的cloneNode

执行以下代码时,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()方法.

谢谢.

javascript internet-explorer clonenode

7
推荐指数
2
解决办法
6523
查看次数

使用cloneNode后如何维护正确的Javascript事件(true)

我有一个包含多行输入的表单元素.将每一行视为我想在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"对象重新绑定到正确的锚标记?

javascript events dom clonenode prototypejs

5
推荐指数
1
解决办法
8599
查看次数

element.cloneNode(true)(深度克隆)的效率如何?

我正在 XML DOM 对象中构建 HTML 代码,以用作使用 XSL 模板的 div 元素的 innerHTML 的内容。传统上,我们创建一个新的 XML DOM 文档,并将输入参数添加为 XML 元素,以便通过 javascript 进行转换。这非常耗时,因为我们基本上是从代表我们当前帐户的另一个 XML 文档中手动选取数据,并将数据复制到瞬态 XML DOM 文档中。

我想做的是克隆帐户文档的相关节点(即客户信息)并将其用作转换的基础。我不想直接使用帐户文档,因为我希望能够添加转换特定输入,而不对帐户对象进行更改。

对于通常包含 2000 多个元素的文档中通常少于 200 个元素的所需节点,使用 .cloneNode(true) 的效率如何?目标平台是IE6,没有外部工具(即ActiveX)。

javascript xml clonenode

5
推荐指数
1
解决办法
8034
查看次数

$ .clone和.cloneNode

我对jQuery $.clone和raw .cloneNode属性之间的区别感到有点困惑.

如果我在做

$('blah').cloneNode(true) 这将在jQuery空间之外创建一个全局对象.

如果我使用

$('blah').clone(true) 这将在jQuery空间内创建一个jQuery对象,但复制包括事件在内的所有内容?

如果我使用jQuery应该坚持,.clone如果我改变我的代码.cloneNode将有任何影响?

jquery clonenode clone

5
推荐指数
1
解决办法
2万
查看次数

为什么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树的深层副本.

我在这里错过了什么吗?

javascript clonenode properties

5
推荐指数
1
解决办法
2251
查看次数

在克隆的节点内设置子<div>的属性

我克隆了一个节点,但我想设置或更改一个div的属性,它克隆节点内,具体而言,改变iddiv 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(哪个更快,没有?)

javascript clonenode clone

3
推荐指数
1
解决办法
2188
查看次数

如何在angular2中动态添加克隆的节点(等同于cloneNode)

在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 clonenode ng-template angular

2
推荐指数
1
解决办法
7060
查看次数

JavaScript:cloneNode 与 importNode

我在一些代码示例中注意到克隆 DOM 节点并将其附加到现有元素的看似不同的方法:

element.appendChild(something.cloneNode(true));
element.appendChild(document.importNode(something, true));
Run Code Online (Sandbox Code Playgroud)

两者都有复制节点的效果。第二个版本似乎更冗长,暗示副本实际上首先是具体的某个地方,尽管它仍然需要找到一个合适的家。但是,它被 MDN 和其他一些用作使用template标签的说明。在其他地方,他们会选择更简单的clodeNode选项。

问题是:使用importNodeover 有cloneNode什么好处?

javascript dom clonenode

1
推荐指数
1
解决办法
959
查看次数

JS 和 HTML - 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 代码中的缩进如何影响输出?或者有什么我错过的吗?

html javascript dom clonenode

1
推荐指数
1
解决办法
2074
查看次数

将所有子节点复制到另一个元素的本机方式

我必须更改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)

javascript xml dom clonenode clone

0
推荐指数
1
解决办法
6466
查看次数