Question

如果我得到一个元素的innerHTML，某些子元素应该有一个尾部斜杠是有效的XHTML（例如，“＆lt; br /＆gt;”），但它们不会，在Chrome，Firefox或IE中，无论doctype如何。

显然这在大多数情况下并不重要，但在我的情况下，我正在使用来自DOM的html作为模板系统的一部分 - 所以如果缺少那些反斜杠，它们就会进入结果页面使用这些模板构建，因此，该页面不会验证为XHTML。非验证页面似乎让我的客户感到难过。

所以....我正在寻找一些javascript代码（也许是一个正则表达式），它会在适当的地方添加反斜杠。如果它适用于这些对我来说足够好的元素类型：

area，base，br，col，embed，hr，img，input，link，meta，param

我想如果有一个＆gt;我不应该感到困惑。在标签内的引号中。

我知道有一个dom-to-xml库（http://xhtmljs.codeplex.com/）可以做到这一点，但它也做了很多其他的事情并且非常暴力。我希望能有更简单的东西。

编辑：

好吧，因为我没有对字符串处理方法有所了解，所以我继续为我做了一些可以解决问题的方法。（虽然它会被引号中的＆gt;混淆，我将在稍后讨论）：

var addClosingSlashes = function (htmlString) {
    var elemTypes = [
    "area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param"];
    var inString, outString = htmlString;
    for (var i=0; i<elemTypes.length; i++) {
      var index1 = 0, index2;
      inString = outString;
      outString = '';
      while ((index1 = inString.indexOf("<" + elemTypes[i])) != -1) {
        if ((index2 = inString.indexOf(">", index1)) != -1 && inString.substring(index2 - 1, index2 + 1) != '/>') {
          outString += inString.substring(0, index2) + " />";
          inString = inString.substring(index2+1);
          }
        else {
          break;      
          }
        }
      outString += inString;
      }
    return outString;
    };

Answer 1

除非这是服务器端的javascript，否则这不会做任何事情。当浏览器执行javascript时，DOM被构建为DOM，而不是某种文本元素。也就是说，元素已经被构建到树中，并且您无法做更多的事情来影响渲染。

Answer 2

尝试根据此问题中的答案更改源文档的投放方式：When objects (e.g. img tag) is created by javascript, it doesn't have the closing tag. How do I make it W3C valid?

另外，请看这个问题的答案...... :-) RegEx match open tags except XHTML self-contained tags

字符串处理以向自动关闭标签添加尾部斜杠（IMG，BR等）

2 个答案: