Node.innerHTML 以小写形式给出标签名称答案

【问题标题】：Node.innerHTML giving tag names in lower caseNode.innerHTML 以小写形式给出标签名称
【发布时间】：2013-04-11 01:34:42
【问题描述】：

我正在迭代 NodeList 以获取 Node 数据，但是在使用 Node.innerHTML 时，我正在获取小写的标记名称。

实际标签

<Panel><Label>test</Label></Panel>

给予

<panel><label>test</label></panel>

我需要这些标签。是否有可能用正则表达式得到它？我正在将它与dojo一起使用（dojo有什么办法吗？）。

var xhrArgs = {
            url: "./user/"+Runtime.userName+"/ws/workspace/"+Workbench.getProject()+"/lib/custom/"+(first.type).replace(".","/")+".html",
            content: {},
            sync:true,
            load: function(data){
                var test = domConstruct.toDom(data);
                dojo.forEach(dojo.query("[id]",test),function(node){
                    domAttr.remove(node,"id");
                });
                var childEle = "";
                dojo.forEach(test.childNodes,function(node){
                    if(node.innerHTML){
                            childEle+=node.innerHTML;
                    }
                });
                command.add(new ModifyCommand(newWidget,{},childEle,context));
            }
    };

【问题讨论】：

什么是“它”？你不能在你的表达式中使用 i （不区分大小写）标志吗？在 HTML 中，标签名称大小写无关紧要。浏览器通常会将标签名称显示为全部大写或全部小写，但这只是一种观察。哦，正则表达式对于解析标记不是很好。哦，如果你称它为 XML，浏览器应该保留大小写。

标签： javascript dojo innerhtml

【解决方案1】：

您不能指望.innerHTML 保留原始 HTML 的确切性质。事实上，在某些浏览器中，由于引用、大小写、属性顺序等不同，它会产生显着差异（尽管生成相同的结果）......

最好不要依赖大小写的保存，调整你的javascript来处理不确定的大小写。

当然可以使用正则表达式进行不区分大小写的搜索（“i”标志将其搜索指定为不区分大小写），尽管使用直接 DOM 访问/搜索而不是使用 innerHTML 通常要好得多搜索。在我们提供一些代码之前，您必须告诉我们更多关于您到底想做什么的信息。

【讨论】：

嗨 jfriend00，我附上了我的代码，我需要标签，因为我在其他地方使用它们来生成 xml。 ModifyCommand 需要文本作为子项。这样它将把数据放在小部件中。

【解决方案2】：

使用正则表达式可能需要我一点时间才能弄清楚，但你可以使用它：

    var str = '<panel><label>test</label></panel>';
    chars = str.split("");
    for (var i = 0; i < chars.length; i++) {
        if (chars[i] === '<' || chars[i] === '/') {
           chars[i + 1] = chars[i + 1].toUpperCase();
        }
    }
    str = chars.join("");

jsFiddle

希望对你有帮助。

【讨论】：

【解决方案3】：

如果您只想将标签名称的第一个字符大写，您可以使用：

var s = 'panel';
s.replace(/(^.)(.*)/,function(m, a, b){return a.toUpperCase() + b.toLowerCase()}); // Panel

您也可以使用字符串操作（可能比正则表达式更有效）：

s.charAt(0).toUpperCase() + s.substring(1).toLowerCase(); // Panel

上面将输出任何输入字符串，其中第一个字符大写，其他所有字符小写。

【讨论】：

【解决方案4】：

这没有经过彻底测试，效率极低，但它在控制台中运行得非常快：（也是jquery，但可以很容易地转换成纯javascript/DOM）

in jsFiddle

function  tagString (element) {
    return $(element).
            clone().
            contents().
            remove().
            end()[0].
            outerHTML.
            replace(/(^<\s*\w)|(<\/\s*\w(?=\w*\s*>$))/g,
                    function (a) {
                        return a.
                               toUpperCase();
                    }).
            split(/(?=<\/\s*\w*\s*>$)/);
}

function capContents (element) {
    return $(element).
            contents().
            map(function () { 
                   return this.nodeType === 3 ? $(this).text() : capitalizeHTML(this);
            })
}

function capitalizeHTML (selector) {
    var e = $(selector).first();
    var wrap = tagString(e);
    return wrap[0] + capContents(e).toArray().join("") + wrap[1];
}

capitalizeHTML('body');

另外，除了是一个很好的练习（在我看来）之外，你真的需要这样做吗？

【讨论】：