<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test case</title>
<script>
function walk(root)
{
if (root.nodeType == 3) // text node
{
doReplace(root);
return;
}
var children = root.childNodes;
for (var i = children.length - 1 ; i >= 0 ; i--)
{
walk(children[i]);
}
}
function doReplace(text)
{
var div = document.createElement("div");
div.innerHTML = text.nodeValue.replace(/\b(\w+)\b/g, "<span>$1</span>");
var parent = text.parentNode;
var children = div.childNodes;
for (var i = children.length - 1 ; i >= 0 ; i--)
{
parent.insertBefore(children[i], text.nextSibling);
}
parent.removeChild(text);
}
window.onload = function() { walk(document.body); };
</script>
</head>
<body>
Foo <span class="f1 b0">bar <b>baz</b> boo blah</span> lorem ipsum
<div><iframe src="/text/plain/wordwrapper.htm.ashx" style="width:60em; height:30em;margin-top:16px"/></div>
</body>
</html>