Question

请帮助，我无法将此javascript实施到我的Blogger中...

(function() {
    var pre = document.getElementsByTagName('pre'),
        pl = pre.length;
    for (var i = 0; i < pl; i++) {
        pre[i].innerHTML = '<span class="line-number"></span>' + pre[i].innerHTML + '<span class="cl"></span>';
        var num = pre[i].innerHTML.split(/\n/).length;
        for (var j = 0; j < num; j++) {
            var line_num = pre[i].getElementsByTagName('span')[0];
            line_num.innerHTML += '<span>' + (j + 1) + '</span>';
        }
    }
})();

您可以在此处看到此Javascript正常工作：http://jsfiddle.net/tovic/AbpRD/1/

Answer 1

当您尝试在主题代码中添加此JavaScript代码段时，您会看到以下类型的错误 -

解析XML时出错：元素的内容必须包含格式良好的字符数据或标记。

然后要解决此错误，请使用以下任一方法 -

1。将代码包含在CDATA代码中的script指令中。代码看起来像 -

<script>
//<![CDATA[
(function() {
    var pre = document.getElementsByTagName('pre'),
        pl = pre.length;
    for (var i = 0; i < pl; i++) {
        pre[i].innerHTML = '<span class="line-number"></span>' + pre[i].innerHTML + '<span class="cl"></span>';
        var num = pre[i].innerHTML.split(/\n/).length;
        for (var j = 0; j < num; j++) {
            var line_num = pre[i].getElementsByTagName('span')[0];
            line_num.innerHTML += '<span>' + (j + 1) + '</span>';
        }
    }
})();
//]]>
</script>

这种方法的唯一缺点是Blogger XML解析器将忽略<data:blog.homepageUrl/>指令中的任何数据布局标记（例如CDATA）。不是用它们的实际值替换它们，而是不解释它们并按原样显示它们。

2. ：转义代码中的以下字符 -

＆＃34;用＆amp; quot替换   ＆安培;被替换为＆amp; amp;
  ＆LT;用＆amp; lt;
替换   ＆GT;被替换为＆amp; gt;

转义后，代码看起来应该像 -

<script>
(function() {
    var pre = document.getElementsByTagName('pre'),
        pl = pre.length;
    for (var i = 0; i & lt; pl; i++) {
        pre[i].innerHTML = '&lt;span class=&quot;line-number&quot;&gt;&lt;/span&gt;' + pre[i].innerHTML + '&lt;span class=&quot;cl&quot;&gt;&lt;/span&gt;';
        var num = pre[i].innerHTML.split(/\n/).length;
        for (var j = 0; j & lt; num; j++) {
            var line_num = pre[i].getElementsByTagName('span')[0];
            line_num.innerHTML += '&lt;span&gt;' + (j + 1) + '&lt;/span&gt;';
        }
    }
})();
</script>

遵循此方法时，数据布局标记将保持有效。请记住围绕数据布局标记的不转义<>（又名<data:blog.homepageUrl/>将有效但不<data:blog.homepageUrl/>）

3. 如果JavaScript中不包含任何数据布局标记。然后，您可以通过布局标签将其添加到 HTML / JavaScript 小工具中，而不是直接将其添加到主题代码中。

如何将这个Javascript实现到Blogger？

1 个答案: