美化生成的字符串答案

【问题标题】：Prettify for generated string美化生成的字符串
【发布时间】：2014-01-10 02:12:03
【问题描述】：

当下拉框被选中时，我正在尝试对生成的字符串应用美化语法突出显示。如果文本是预先放置的，它可以正常工作，但如果它是生成的，则文本不会突出显示。我试过调用 prettyPrint() 函数，但还是不行。

    $('#db').change(
        function(){
            query = "";
        query = "<pre class=\"prettyprint\" id=\"query\">Insert Into ";
            query = query + $('#db').val() + "</pre>";
            document.getElementById("pp").innerHTML = query;
            prettyPrint();
           $.ajax({
              url: "functions.php?&f=table",
              type: "GET",
              data: { db: $('#db').val() }
           }) 
           .done(function(result) {
                $('#table').html(result);
        })
        .fail(function() {
            alert( "error" );
        });
        }
    );

【问题讨论】：

在控制台上显示“Uncaught ReferenceError: prettyPrint is not defined”，但如果它在没有生成的字符串的情况下工作，这意味着脚本被正确引用对吗？
您是否在其他地方定义了prettyPrint？如果不是，那可能会打断你的执行
检查这个jsfiddle.net/raunakkathuria/fB9bk它工作正常，可能是prettyprint函数的问题
Prettyprint 函数来自 Google 的 prettyprint 库。除了之外没有定义其他函数
根据文档你不需要调用你只需要包含它的函数，更新了小提琴jsfiddle.net/raunakkathuria/fB9bk它工作正常

标签： javascript jquery syntax-highlighting

【解决方案1】：

这里是documentation的详细答案

如果您加载此脚本，则无需调用prettyPrint() 函数，它会自动使用类prettyprint 美化内容

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>

但是如果你分别加载css和js文件则需要调用prettyPrint()

<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>

来自文档：，然后在页面完成加载后运行 prettyPrint 功能。一种方法是通过 onload 处理程序，因此：

<body onload="prettyPrint()">

DEMO 包含脚本而不是单独加载

【讨论】：