1

I'm working on a project which is doing some DOM tree walking. In order to insert some span tags to add highlights to a document, it is sometimes necessary to split a textnode:

var newTextNode = treeWalker.currentNode.splitText(charOffset);

The issue is then when I next try to call:

if (newTextNode.nodeValue == "")
{
    //...
}

This .nodeValue call yields a JavaScript error in IE9 which says simply, Incorrect function. Wholly unhelpful to say the least. Thinking perhaps something weird is going on, I opened up the debugger and executed: typeof newTextNode.nodeValue which returns "unknown".

Is anyone able to explain this behavior? I thought maybe that function simply doesn't apply to text nodes, but it works just fine in other scenarios. It's only after calling splitText that it seems to puke.

I thank everyone for their help! My Google-fu has been thus far insufficient.

ADDITION:

After looking at the newTextNode object, there's more properties that evaluate to "Incorrect Function"

  • data
  • length
  • nodeValue
  • textContent
  • wholeText
Adam Terlson
  • 12,610
  • 4
  • 42
  • 63
  • See also [How to retrieve the text of a DOM Text node?](http://stackoverflow.com/questions/7690627/how-to-retrieve-the-text-of-a-dom-text-node) – hippietrail Sep 05 '12 at 17:50

2 Answers2

6

This is a bug in IE 9.

What IE 9 is returning is clearly not a text node. What it is I'm not quite sure yet. It happens when you call textNode.splitText(n) where n is equal to the length of the text in the text node. This doesn't happen in IE 7 (unable to test 8 right now) and all other major browsers, and is contrary to the DOM 2 spec, which states that splitText()

Breaks this node into two nodes at the specified offset, keeping both in the tree as siblings. After being split, this node will contain all the content up to the offset point. A new node of the same type, which contains all the content at and after the offset point, is returned. If the original node had a parent node, the new node is inserted as the next sibling of the original node. When the offset is equal to the length of this node, the new node has no data.

The easiest solution would be to add a check for this case:

if (n < textNode.length) {
    newTextNode = textNode.splitText(n);
}
Tim Down
  • 318,141
  • 75
  • 454
  • 536
  • I'm happy to get some validation that I'm not crazy. I'll look into what's going on here and try out your suggestion! Just off the top of my head, I don't believe the splitText `n` value is actually the length of the text in the node, but I'll verify. Thanks for the help. – Adam Terlson May 10 '11 at 15:50
0

IE8 works correctly, returning an empty node if you split a textnode at the length of its value. IE9 works correctly until you try to split on the length of the data.

I expect IE9 (or IE10) will get it right, but IE6 had the same problem- it would fail to split a textnode at an index as long as its length.

The other browsers will likewise fail if you pass an index greater than the text length, so you could check the node's data.length before splitting.

If the length is less than or equal to the index you want to split on, leave it alone and append a new empty node next to it.

IE9 (and the others) return an empty string for the data or nodeValue of a textnode created with an empty string.

kennebec
  • 102,654
  • 32
  • 106
  • 127