replaceNode [英] replaceNode
问题描述
您好，
我使用JavaScript替换HTML树中的节点。目前我使用Mozilla和localhost来使用服务器文件。
1. Eveytime我用一个新节点替换一个节点，新文本的大小
似乎增加了一些额外的行似乎出现在页面中。
我用一个新节点替换一个节点，假设有一个
行"< H2>文字文字文字< / H2>"存储在变量中（比如说A）。
var newnode = document.createElement（" H2"）;
newnode.innerHTML = A;
oldnode.replaceChild（newnode，existing_node）;
" Text Text Text"当显示的内容看起来比实际大小更大时，新显示的页面中似乎还出现了额外的行（上下文字文本
"） 。知道为什么会发生这种情况吗？
2.一旦我显示新页面（通过添加额外的
节点和......来修改现有页面），然而，页面的源代码没有改变，因此DOM结构（尽管添加了一些新节点）也是相同的。如果我要对新形成的页面进行一些新修改
（而不是原始页面），我会遇到问题吗？任何解决方案
那个??
谢谢
Anand
-
Anand
------------------------------------- -----------------------------------
Anand'的个人资料：< a rel =nofollowhref =http://www.highdots.com/forums/member.php?userid=72target =_ blank> http://www.highdots.com/forums/member.php ？userid = 72
查看以下主题： http://www.highdots.com/forums/showthread.php?t=1746467
Hi,
I am using JavaScript to replace a node in HTML Tree. Currently I
am using Mozilla and localhost to server files.
1. Eveytime I replace a node with a new node, the size of the new texts
seems to increase and some extra lines seem to appear in the page.
I am replacing a node with a new node, which is suppose to have the
line "<H2> Text Text Text </H2>" stored in a variable (say A).
var newnode = document.createElement("H2");
newnode.innerHTML = A;
oldnode.replaceChild(newnode,existing_node);
"Text Text Text " when gets displayed seem bigger than actual size of
H2 and extra lines also seem to appear(above and below "Text Text Text
") in the newly displayed page. Any idea why this might be happening?
2. Once I display the new page (modified from existing by adding extra
nodes and ...), the source code of the page however is not changed and
thus the DOM structure (although some new nodes were added) is also
same. If I am to make some new modifications to the newly formed page
(and not the original page), will I face problems??? any solution for
that??
Thanks
Anand
--
Anand
------------------------------------------------------------------------
Anand''s Profile: http://www.highdots.com/forums/member.php?userid=72
View this thread: http://www.highdots.com/forums/showthread.php?t=1746467
推荐答案
Anand写道：
我使用JavaScript替换HTML树中的节点。目前我正在使用Mozilla和localhost来处理服务器文件。
1. Eveytime我用一个新节点替换节点，新文本的大小似乎增加了一些额外的线条似乎出现在页面中。
我正在用一个新节点替换一个节点，该节点假设有
行<< H2>文字文字文字< / H2>"存储在变量中（比如说A）。
var newnode = document.createElement（" H2"）;
newnode.innerHTML = A;
oldnode.replaceChild（newnode， existing_node）;
" Text Text Text"当显示的内容看起来比实际大小时更大，并且在新显示的页面中似乎也出现了额外的行（在文本文本文本上方和下方文本文本文本）。知道为什么会这样吗？
你用createElement创建一个新的H2元素，然后当你使用innerHTML和''< H2> ....时，你创建了另一个
< / H2> ''。尝试：
var A =文本文本文本
var newnode = document.createElement（" H2"）;
newnode.appendChild（document.createTextNode（A））;
oldnode.replaceChild（newnode，existing_node）;
2.一旦我显示新页面（修改自通过添加额外的节点和...来存在，但是页面的源代码没有改变，因此DOM结构（虽然添加了一些新节点）也是相同的。如果我要对新形成的页面进行一些新的修改
（而不是原始页面），我会遇到问题吗？
的任何解决方案??
Hi,
I am using JavaScript to replace a node in HTML Tree. Currently I
am using Mozilla and localhost to server files.
1. Eveytime I replace a node with a new node, the size of the new texts
seems to increase and some extra lines seem to appear in the page.
I am replacing a node with a new node, which is suppose to have the
line "<H2> Text Text Text </H2>" stored in a variable (say A).
var newnode = document.createElement("H2");
newnode.innerHTML = A;
oldnode.replaceChild(newnode,existing_node);
"Text Text Text " when gets displayed seem bigger than actual size of
H2 and extra lines also seem to appear(above and below "Text Text Text
") in the newly displayed page. Any idea why this might be happening?
You create a new H2 element with createElement, then you create
another when you use innerHTML with ''<H2>....</H2>''. Try:
var A = "Text Text Text"
var newnode = document.createElement("H2");
newnode.appendChild(document.createTextNode(A));
oldnode.replaceChild(newnode,existing_node);
2. Once I display the new page (modified from existing by adding extra
nodes and ...), the source code of the page however is not changed and
thus the DOM structure (although some new nodes were added) is also
same. If I am to make some new modifications to the newly formed page
(and not the original page), will I face problems??? any solution for
that??
来源已更改，但浏览器只会显示原始的
来源。
< URL：http：//groups.google.com.au/group/comp.lang.javascript/browse_thread/thread/8acbf8295c3cedc9/0efaa271ed564bfb？q = view + source +代码+ javascript + inn erHTML& rnum = 1& hl = en＃0efaa271ed564bfb>
或者将以下内容复制/粘贴到地址栏中 - 您可以保存它
作为经常使用的书签：
javascript ：CODE = window.open（""，" CODE"，" height） = 700，width = 800"）;
CODE.document.write（"< FORM NAME = \" SPAM \">< TEXTAREA NAME = \" SRC \"
ROWS = 45 COLS = 82>< / TEXTAREA>< / FORM>"）;
CODE.document.SPAM.SRC。 value = document.documentElem ent.innerHTML; void 0
它应该粘贴为一行而不返回 - 确保没有添加
或添加空格不应该在哪里。
-
Rob
The source is changed, but the browser will only show you the original
source.
<URL:http://groups.google.com.au/group/comp.lang.javascript/browse_thread/thread/8acbf8295c3cedc9/0efaa271ed564bfb?q=view+source+code+javascript+inn erHTML&rnum=1&hl=en#0efaa271ed564bfb>
Or copy/paste the following into the address bar - you could save it
as a bookmark for frequent use:
javascript:CODE=window.open("" , " CODE ", "height=700, width=800");
CODE.document.write("<FORM NAME=\"SPAM\"><TEXTAREA NAME=\"SRC\"
ROWS=45 COLS=82></TEXTAREA></FORM>");
CODE.document.SPAM.SRC.value=document.documentElem ent.innerHTML; void 0
It should be pasted as a single line with no returns - make sure none
have been added or whitespace added where it shouldn''t be.
--
Rob
对于第一个你建议我的地方：
var A =" Text Text Text"
newnode.appendChild（document.createTextNode（A））;
oldnode.replaceChild（newnode，existing_node）;
它的作用是将文本文本文本放在适当的位置。然而
我的变量''A''中包含标签。即。 < H2>文本文本文本< / h2>
我不想显示当我们从B创建文本节点时将发生的标记。这就是为什么我使用了innerHTML。
感谢您的回复。如果我弄错了，请建议。
Anand
-
Anand
- -------------------------------------------------- ---------------------
Anand'的个人资料： http://www.highdots.com/forums/member.php?userid=72
查看此主题： http：//www.highdots。 com / forums / showthread.php？t = 1746467
Hi,
For this first one where you suggested me to:
var A = "Text Text Text"
var newnode = document.createElement("H2");
newnode.appendChild(document.createTextNode(A));
oldnode.replaceChild(newnode,existing_node);
What this does is it puts Text Text Text to the proper place. however
my variable ''A'' has tags included in it. ie. <h2> Text Text Text </h2>
and I wouldn''t want to display the tags which will happen when we
create a text node out of A. Thats why I used innerHTML.
Thanks for your reply. Please suggest if I am getting it wrong.
Anand
--
Anand
------------------------------------------------------------------------
Anand''s Profile: http://www.highdots.com/forums/member.php?userid=72
View this thread: http://www.highdots.com/forums/showthread.php?t=1746467
Anand写道：
对于您建议我的第一个：
var A =" Text Text Text"
var newnode = document.createElement（" H2"）;
newnode .appendChild（document.createTextNode（A））;
oldnode.replaceChild（newnode，existing_node）;
它的作用是将文本文本文本放到适当的位置。然而
我的变量''''中包含标签。即。 < H2>文本文本文本< / h2>
我不想显示当我们用A创建文本节点时会发生的标签。这就是我使用innerHTML的原因。
Hi,
For this first one where you suggested me to:
var A = "Text Text Text"
var newnode = document.createElement("H2");
newnode.appendChild(document.createTextNode(A));
oldnode.replaceChild(newnode,existing_node);
What this does is it puts Text Text Text to the proper place. however
my variable ''A'' has tags included in it. ie. <h2> Text Text Text </h2>
and I wouldn''t want to display the tags which will happen when we
create a text node out of A. Thats why I used innerHTML.
您的困难是由createElement与innerHTML混合引起的。如果
''oldnode''的* only *内容是''existing_node''，那么：
var A =''< h2> ...< / h2>''
oldnode.innerHTML = A;
将使用''A中的文本完全替换oldnode的内容''。
由于A包含HTML标记，innerHTML将导致浏览器解析HTML（请注意，innerHTML没有公开规范，
我只是报告观察到的行为）。
但是，我怀疑''existing_node''只是众多孩子中的一个
of ''oldnode''并且你试图只替换一个节点。在
这种情况下你需要一种''占位符'来将innerHTML放入。
我相信outerHTML可以解决问题，基本上取代了HTML
$'$ b'的''existing_node''和''A'' - 但这几乎是IE独有的，
所以对网络不太友好。
你可能想玩createDocumentFragment：
< URL：http：//www.mozilla.org/docs/dom/domref/dom_doc_ref45.html#1025874>
您应该使用特征检测来确保它受支持，也许
尝试文档片段，然后是outerHTML。
- -
Rob
Your difficulty is caused by mixing createElement with innerHTML. If
the *only* content of ''oldnode'' is ''existing_node'', then:
var A = ''<h2> ... </h2>''
oldnode.innerHTML = A;
will completely replace the content of oldnode with the text in ''A''.
Since A contains HTML markup, innerHTML will cause the browser to
parse the HTML (note, there is no public specification for innerHTML,
I''m just reporting observed behaviour).
However, I suspect that ''existing_node'' is just one of many children
of ''oldnode'' and that you are trying to replace just the one node. In
that case you need a kind of ''placeholder'' to put the innerHTML into.
I believe outerHTML does the trick, essentially replacing the HTML
of ''existing_node'' with ''A'' - but that is almost exclusive to IE and
so not very web-friendly.
You may want to play with createDocumentFragment:
<URL:http://www.mozilla.org/docs/dom/domref/dom_doc_ref45.html#1025874>
You should use feature detection to ensure it is supported, perhaps
try document fragment, then outerHTML.
--
Rob
这篇关于replaceNode的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
