4

我正在尝试执行一个简单的搜索和突出显示功能Javascript来搜索一段文本。出现该段文本的XHTML标记也作为参数给出,以在定位该文本时提供额外帮助。

我正在测试此功能的 XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
 "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta content="application/xml+xhtml;charset=UTF-8" />
<script src="searcher.js" type="text/javascript"></script>
<script src="jquery-2.0.2.min.js"> </script>
<title>Building your resume</title>
</head>
<body id="highlightbegin">
<h1>Building your resume</h1>

<div> <input name="input" type="button" value="Highlight3" onclick="javascript:searcher('&lt;h1&gt;','Building your resume', '&lt;h1&gt;Building your resume', 'resume');" /> </div>

</body>
</html>  

searcher.js 中的函数 searcher:

function searcher(tag, text, tagText, word) {

    //simple search.
    console.info(word + " to be searched for in " + text + " with tag text = " + tagText);

    //get old html.
    var oldHTML = document.getElementById("highlightbegin").innerHTML;

    //get regexp.
    var regexp = new RegExp(tagText, 'g');

    var match = oldHTML.match(regexp);
    console.info(text + " found " + match.length + " times.");
}  

但是,执行RegExp, match 会返回null。进一步的调查显示,标签<h1>Building your resume</h1>成为<h1 xmlns="http://www.w3.org/1999/xhtml">Building your resume</h1>导致match函数返回的原因null。我的问题:

  1. 为什么会xmlns自动添加属性?
  2. 有没有办法防止属性被添加?
  3. 该属性将添加到哪些标签?假设它将被添加到每个标签中是否安全?
  4. 这是特定于浏览器的问题,还是在所有浏览器中都可以预期这种行为?

编辑:
观察:
1. 如果我将xmlns属性添加到body标签并使用outerHTML( var oldHTML = document.getElementById("highlightbegin").outerHTML;) 访问所有内容,则其子元素没有该xmlns属性。
我的问题:
1. outerHTML 元素可以编辑(用Javascript)和替换吗?
2.上面的观察是一致的(每次outerHTML调用都看到)还是依赖于实现?
3. 是自动Javascript添加xmlns属性还是浏览器添加?

4

1 回答 1

3
Why is the xmlns attribute added automatically?

因为如果不这样做,标记将不能代表 DOM 中元素的命名空间,在这种情况下,如果您将字符串写回 DOM,则浏览器将不再将元素解释为 HTML 元素,你的页面会中断。

Is there a way to prevent the attribute from being added?

不是innerHTML,如果您使用的是XMLDocument,您似乎就是这样。如果需要,您可以通过遍历 DOM 来创建自己的序列化程序。

What tags will that attribute be added to? Is it safe to assume that it will be 
added to every tag?

至少每个开始标记都是您调用 innerHTML 的元素的顶级子元素,假设子元素不在 null 命名空间中。加上与其父级不同命名空间中的任何后代元素的开始标记。如果浏览器选择这样做,将它添加到所有开始标签中并没有错。

Is this a browser-specific issue or can this behavior be expected in all browsers?

使用 innerHTML 序列化 DOM 历来因浏览器而异。尽管浏览器应该始终如一地这样做,但我不会依赖它。

1. Can the outerHTML element be edited (with Javascript) and replaced?

理论上是的,但它不会有帮助。您必须将元素替换为 null 命名空间中的一个,以阻止该属性出现在外部元素上,这只会导致 outerHTML 将该属性添加到子元素(因为它们随后将具有与其父元素不同的命名空间)。

2. Is the observation above consistent (seen each time outerHTML is invoked) or is 
   it implementation dependent?

出于与使用 innerHTML 相同的原因,序列化必须在某些地方添加属性以便可以成功读回字符串,并且可以在浏览器想要添加的地方添加属性。不能保证它会是一致的。

3. Is it Javascript that adds the xmlns attribute automatically or the browser?

这是浏览器将 DOM 序列化为字符串的内置过程。该属性通常不在 DOM 中的元素上(该<html>元素是正常的例外),它被添加到浏览器认为有必要的任何地方,因为它被转换为字符串。

更笼统地说,这是专家们试图阻止尝试使用正则表达式处理 HTML 标记的原因之一。即使使用 HTML 而不是 XHTML,在这种情况下,无需担心命名空间业务,在字符串和 DOM 表单之间的转换期间,可以添加和删除属性,并且可以以任意方式更改它们的顺序,而不能保证它们之间的一致性浏览器品牌,甚至同一浏览器品牌的后续版本。

于 2013-09-12T14:13:16.803 回答