prettyPrint() 函数在页面加载后不起作用答案

【问题标题】：prettyPrint() function does not work after a page is loadedprettyPrint() 函数在页面加载后不起作用
【发布时间】：2015-09-28 17:28:04
【问题描述】：

我正在通过 CDN <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script> 使用google-code-prettify，如here 的常见问题解答中所述@prettyPrint() 是高亮代码的功能。现在我遇到了问题

prettyPrint() 当我调用这个函数时它说未定义当页面加载并突出显示语法时，cdn 会自动调用此函数，但加载后我正在更改代码内容，然后我希望它再次突出显示。但我无法使用prettyPrint() 功能。

我自己托管google-code-prettify，然后我使用了prettyPrint()，它运行良好，但是当我在更改代码后调用此函数时没有任何反应，它不会突出显示我的语法

这是我正在使用的代码

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Developer Query</title>
<link href="css/header.css" rel="stylesheet" type="text/css">
<script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
<style>
/*This CSS applied button in which section user is visiting. */
ul#nav > li#btn2 {
    border-top: 3px solid #FF9900;
    border-left: 2px solid grey;
    border-right: 2px solid grey;
    border-bottom: 2px solid white;
    border-radius: 4px;
}
/*Button CSS is end. */ 
.content{
    width:1136px;
    margin:0px auto;
}
input#question_title{
    margin:20px auto;
    width:100%;
    height:20px;
}
textarea#question_content{
    width:100%;
    height:300px;
    margin:0px auto;
}
#preview{
    width:100%;
    overflow:auto;
}
</style>
</head>

<body>
<?php include_once('php_include/header.php'); ?>
<div class="content">
    <input type="text" name="question_title" id="question_title" placeholder="What happed with your code?" />
    <textarea id="question_content" name="question_content" placeholder="Elabrote your code" onKeyUp="render();"></textarea>
    <h3>Here's what it look like</h3>
    <code class="prettyprint"><div id="preview">&lt;html&gt;</div></code>
    </div>
</body>
<script>
//HELPER FUNCTIONS////
function $(id){
    return document.getElementById(id);
}
function render(){//
    var question_content = $("question_content").value;
    //Sanitizing data//
    var entitles = {//List of all Html entitiles
        '<':"&lt;",
        '>':"&gt;",
        '\n':"<br>",        
    }
    question_content = question_content.replace(/<|>|\n/gi, function (html_ent){return entitles[html_ent];});
    var preview = $("preview");
    preview.innerHTML = question_content;   
    //prettyPrint();
}
</script>
</html>

【问题讨论】：

请显示您的 HTML，包括您使用 prettify 的位置。可能是 DOM 问题。
用我的代码更新问题
我没有看到你实际包含脚本的地方。您的代码中是否有 <script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script> 或类似内容？
@andrewFan 再次更新

标签： javascript syntax-highlighting google-code-prettify

【解决方案1】：

当prettyprint() 运行时，它会将“prettyprinted”类添加到它更改的每个元素中。如果您需要重新申请prettyprint()，请先删除“prettyprinted”类，然后调用prettyprint()。

【讨论】：