用正则格式格式化InnerHTML文本无法正常工作



技术:ASP.NET 4.5 WebForms

我正在使用以下JavaScript函数在代码块中上色文本。如果我在功能后立即使用警报停止代码,则实际上可以工作。但是,正则渲染并不粘。功能完成后,如何使结果呈现?以下是一个小样本。

CSS

<style type="text/css">
    .blue
    {
        color: blue;
    }
    .demo
    {
        background-color: gainsboro; 
        width: 300px; 
        height: 100px; 
        padding: 5px;
    }
</style>

javascript

<script type="text/javascript">
    function Prettyfy() {
        var keys = ["Dim", "As", "String"]
        for (var i = 0; i < keys.length; i++) {
            var value = keys[i];
            var str = document.getElementById("demo").innerHTML;
            var regexExpression = "(?!(?:[^<]+>|[^>]+<\/a>))\b(" + value + ")\b";
            var regex = new RegExp(regexExpression, "ig");
            document.getElementById("demo").innerHTML = str.replace(regex, '<span class="blue">' + value + '</span>');
        }
        alert(document.getElementById("demo").innerHTML);
    }
</script>

html

<body>
    <form id="form1" runat="server"> <pre id="demo" class="demo">
            <code>
    dim motor as string
    dim reducer as string
            </code>
        </pre>
        <br />
        <button onclick="Prettyfy()">Prettyfy Code</button>
    </form>
</body>

问题很可能是您的表格默认情况下会导致页面重新粉刷。将"类型"属性添加到您的<button>

<button type=button onclick="Prettyfy()">

(目前尚不清楚为什么完全有形式。)

最新更新