将DOM对象换入/换出对象变量？ [英] Swap DOM objects in / out to object variables?

查看：79
本文介绍了将DOM对象换入/换出对象变量？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我知道可以动态删除DOM中的元素，但是

而不是永久删除它们，是否有可能捕获它们并且

保存它们作为一个对象变量，所以它们可以在其他地方重复使用？


考虑一下......


有两个具有相同ID的DIV标签值得。


如果你可以将一个DIV标签移出一个对象变量，那么它就不是一个巧妙的技巧，以便getElementById（ ）将返回结果

的DIV标签仍然存在？将第一个DIV标记对象交换回来，然后在第二个重复该过程的
将返回第一个DIV标记在

getElementById（）上。


我尝试通过在Object对象上创建一个clone（）原型函数来克隆一个DOM元素，但是这不起作用。


有什么想法吗？


史蒂夫

解决方案

我不保证这个对于标准或跨浏览器的兼容性，但在最新的IE浏览器上它可以使用
：

< head>

< title>

使用Cloning和removeNode进行Div替换测试会将div交换

三次，从而使它们以相反的顺序交换

< / title>

< script>

function swapem（）{

var mydiv = document.getElementById（" my1"）。cloneNode（tru e）;

document.getElementById（" my1"）。removeNode（true）;

alert（document.getElement） ById（" my1"）。innerHTML）;

document.getElementById（" my1"）。insertAdjacentEleme nt（" afterEnd"，mydiv）;

}

< / script>

< / head>

< body

onload =" alert（ document.getElementById（''my1''）。inner HTML）; swapem（）; swapem（）; swapem（）;">

< DIV id = my1>

这是div1

< / div>

< div id = my1>

这是div1.1

< / div>

< / body>


2005年1月26日19:08:29 -0800 ，在comp.lang.javascript中
sn****@mxlogic.com 写道：

|我知道可以动态删除DOM中的元素，但是
|而不是永远删除它们，是否有可能捕获它们和
|将它们保存为对象变量，以便在其他地方重复使用？
|
|考虑一下......
|
|有2个DIV标签具有相同的ID值。
|
|如果你可以移动其中一个DIV标签，那不是一个巧妙的技巧吗？到一个对象变量，以便getElementById（）返回一个结果
|对于剩下的DIV标签？将第一个DIV标记对象交换回来并且
|在第二个上重复该过程将返回
|上的第一个DIV标记getElementById（）。
|
|我尝试通过创建clone（）原型函数来克隆DOM元素
|在Object对象上，但是没有用。
|
|任何人的想法？




你有2个ID相同的事实将导致

应用程序逻辑问题。当你告诉程序操纵

ID应该操作的ID时，第一个还是第二个？

应用程序如何知道哪个2个相同的ID是活跃的或者要克隆的ID？


你最好给DIV提供唯一的ID和NAME属性。 />
然后在你的代码库中，变量中的''active''元素和

然后进行进一步处理。

------- -------------------------------------------------- ------
jn******@yourpantsyahoo.com.au ：脱掉裤子回复

------------------------------------- --------------------------




< a href =mailto：sn **** @ mxlogic.com> sn **** @ mxlogic.com 写道：

我知道它可以动态从DOM中删除元素，但不是永久删除它们，是否有可能捕获它们并将它们保存为对象变量，以便它们可以在其他地方重复使用？


当然，节点可以从文档中分离并存储在变量

中或附加到文档片段，然后重新插入或移动

其他地方。


我尝试通过在Object对象上创建一个clone（）原型函数克隆一个DOM元素，但那并没有用。




DOM节点是宿主对象，因此Object原型上的方法没有帮助，但你可以调用cloneNode（true）一个深度克隆和

cloneNode（false）用于DOM节点上的浅层克隆。

-


Martin Honnen
http://JavaScript.FAQTs.com/


I know its possible to dynamically remove elements from the DOM, but
rather than deleting them forever, is it possible to ''capture'' them and
save them as an object variable so they can be reused elsewhere?

Consider this...

There are 2 DIV tags with the same ID value.

Wouldn''t it be a neat trick if you could move one of the DIV tags out
to an object variable so that a getElementById() would return a result
for DIV tag that remained? Swapping the first DIV tag object back and
repeating the process on the second would return the first DIV tag on a
getElementById().

I tried cloning a DOM element by creating a clone() prototype function
on the Object object, but that didn''t work.

Any ideas anyone?

Steve

解决方案

I don''t guarantee this for standards or cross-browser compatibility, but
on latest IE it works:
<head>
<title>
Test of Div Replacement using Cloning and removeNode will swap the divs
three times thus leaving them in reverse order
</title>
<script>
function swapem() {
var mydiv=document.getElementById("my1").cloneNode(tru e);
document.getElementById("my1").removeNode(true);
alert(document.getElementById("my1").innerHTML);
document.getElementById("my1").insertAdjacentEleme nt("afterEnd",mydiv);
}
</script>
</head>
<body
onload="alert(document.getElementById(''my1'').inner HTML);swapem();swapem();swapem();">
<DIV id=my1>
This is div1
</div>
<div id=my1>
This is div1.1
</div>
</body>


On 26 Jan 2005 19:08:29 -0800, in comp.lang.javascript
sn****@mxlogic.com wrote:

| I know its possible to dynamically remove elements from the DOM, but
| rather than deleting them forever, is it possible to ''capture'' them and
| save them as an object variable so they can be reused elsewhere?
|
| Consider this...
|
| There are 2 DIV tags with the same ID value.
|
| Wouldn''t it be a neat trick if you could move one of the DIV tags out
| to an object variable so that a getElementById() would return a result
| for DIV tag that remained? Swapping the first DIV tag object back and
| repeating the process on the second would return the first DIV tag on a
| getElementById().
|
| I tried cloning a DOM element by creating a clone() prototype function
| on the Object object, but that didn''t work.
|
| Any ideas anyone?



The fact that you have 2 IDs the same is going to cause the
application logic problems. When you tell the program to manipulate
the ID which ID is it supposed to manipulate, the first or the second?
How will the application ''know'' which of the 2 identical IDs are
active or which one to clone?

You''d be better off giving the DIVs unique IDs and NAME attributes.
Then in your code store the ''active'' element within a variable and
then do further processing.
---------------------------------------------------------------
jn******@yourpantsyahoo.com.au : Remove your pants to reply
---------------------------------------------------------------




sn****@mxlogic.com wrote:

I know its possible to dynamically remove elements from the DOM, but
rather than deleting them forever, is it possible to ''capture'' them and
save them as an object variable so they can be reused elsewhere?
Sure, a node can be detached from the document and stored in a variable
or attached to a document fragment and later on reinserted or moved
elsewhere.

I tried cloning a DOM element by creating a clone() prototype function
on the Object object, but that didn''t work.



DOM nodes are host objects so a method on the Object prototype doesn''t
help but you can call cloneNode(true) for a deep clone and
cloneNode(false) for a shallow clone on DOM nodes.
--

Martin Honnen
http://JavaScript.FAQTs.com/


这篇关于将DOM对象换入/换出对象变量？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆