javascript - can a textNode have a childNode which is an elementNode? - Stack Overflow

admin管理员组

文章数量:1343311

Say,is the following possible:

textNode.appendChild(elementNode);

elementNode refers to those with nodeType set to 1

textNode refers to those with nodeType set to 2

It's not easy to produce.

The reason I ask this is that I find a function that adds a cite link to the end of a quotation:

function displayCitations() {
  var quotes = document.getElementsByTagName("blockquote");
  for (var i=0; i<quotes.length; i++) {
  if (!quotes[i].getAttribute("cite")) continue;
  var url = quotes[i].getAttribute("cite");
  var quoteChildren = quotes[i].getElementsByTagName('*');
  if (quoteChildren.length < 1) continue;
  var elem = quoteChildren[quoteChildren.length - 1];
  var link = document.createElement("a");
  var link_text = document.createTextNode("source");
  link.appendChild(link_text);
  link.setAttribute("href",url);
  var superscript = document.createElement("sup");
  superscript.appendChild(link);
  elem.appendChild(superscript);
  }
}

see the last line "elem.appendChild(superscript);" where elem can be a textNode?

I think the reason it's difficult to prove it because it's hard to get access to a specified textNode. Have anyone any way to achieve that?

Say,is the following possible:

textNode.appendChild(elementNode);

elementNode refers to those with nodeType set to 1

textNode refers to those with nodeType set to 2

It's not easy to produce.

The reason I ask this is that I find a function that adds a cite link to the end of a quotation:

function displayCitations() {
  var quotes = document.getElementsByTagName("blockquote");
  for (var i=0; i<quotes.length; i++) {
  if (!quotes[i].getAttribute("cite")) continue;
  var url = quotes[i].getAttribute("cite");
  var quoteChildren = quotes[i].getElementsByTagName('*');
  if (quoteChildren.length < 1) continue;
  var elem = quoteChildren[quoteChildren.length - 1];
  var link = document.createElement("a");
  var link_text = document.createTextNode("source");
  link.appendChild(link_text);
  link.setAttribute("href",url);
  var superscript = document.createElement("sup");
  superscript.appendChild(link);
  elem.appendChild(superscript);
  }
}

see the last line "elem.appendChild(superscript);" where elem can be a textNode?

I think the reason it's difficult to prove it because it's hard to get access to a specified textNode. Have anyone any way to achieve that?

• javascript
• dom

Share Improve this question Follow edited Mar 10, 2016 at 13:47 autistic 15.7k44 gold badges4040 silver badges8181 bronze badges asked Jul 10, 2009 at 18:38 omgomg 140k145145 gold badges291291 silver badges351351 bronze badges 3

• No - in this example elem cannot be a textNode. the array quoteChildren is populated via HTMLElement.getElementsByTagName() which doesn't return text nodes. And elem is the last value in quoteChildren – Peter Bailey Commented Jul 10, 2009 at 19:00
• Right,I've found my mistake.But the question still deserves a answer,right?Have you tried to append an elementNode to a textNode? – omg Commented Jul 10, 2009 at 19:03
• Yup, never had before but it was trivial to exercise. Check my answer below. – Peter Bailey Commented Jul 10, 2009 at 19:06

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 8

No, text nodes are always leafs. Instead you must add new nodes to the text node's parent - making them siblings of the text node.

EDIT

Here's an example where I attempt to add a child to a text node.

<div id="test">my only child is this text node</div>

<script type="text/javascript">

var div = document.getElementById( 'test' );
var textNode = div.childNodes[0];
var superscript = document.createElement("sup");
superscript.text = 'test';

textNode.appendChild( superscript );

</script>

Firefox gives the error

uncaught exception: Node cannot be inserted at the specified point in the hierarchy (NS_ERROR_DOM_HIERARCHY_REQUEST_ERR)

I don't think so; I'm fairly certain that something like

<div>this is some <a href="...">text</a> with an element inside it.</div>

ends up being:

<div>
    <textnode/>
    <a>
        <textnode/>
    </a>
    <textnode/>
</div>

I don't believe textNodes can have children.

If I had to guess, I'd think that the result of adding a child node to a text node would be to add the element to the text node's parent instead, but I've not tested that at all.

No. Elements may contain attributes, other elements, or text.

本文标签： javascriptcan a textNode have a childNode which is an elementNodeStack Overflow