B T*_*B T 24 html pretty-print
我正在寻找一种方法来自动格式化和编写我在HTML文档中编写的代码.我知道维基百科会这样做,例如在页面上:http://en.wikipedia.org/wiki/Nested_function
我确信有些图书馆可以做到这一点,但我不能为我的生活找到一个.有没有人有什么建议?
Bli*_*ixt 40
看看Prettify JavaScript库.它是人们通常使用的那个(例如,这是在SO上使用的那个.)
你会像这样使用它:
在你的<head>元素中:
<link href="prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="prettify.js"></script>
Run Code Online (Sandbox Code Playgroud)
在你的<body>元素中:
<body onload="prettyPrint()">
<!-- any HTML you like here... -->
<pre class="prettyprint">
def say_hi():
print("Hello World!")
</pre>
<!-- any HTML you like here... -->
</body>
Run Code Online (Sandbox Code Playgroud)
这是为了简单地使用库.如果你在你的页面上使用其他JavaScript我会推荐其他方法来启用Prettify库(即,不要使用元素的onload属性<body>.)例如,如果你使用jQuery,我写了这个jQuery插件,我通常使用语法突出显示某些元素:
// Extend jQuery functionality to support prettify as a prettify() method.
jQuery.fn.prettify = function () { this.html(prettyPrintOne(this.html())); };
Run Code Online (Sandbox Code Playgroud)
像这样使用:
$('#my-code-element').prettify();
Run Code Online (Sandbox Code Playgroud)
我认为更简单而强大的解决方案是highlight.js。它目前支持 169 种语言和 77 种代码样式(如 Solarized 深色和浅色)。多一点:
快速设置:
1 - 在 HTML 头部:
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
Run Code Online (Sandbox Code Playgroud)
2 - 在您的 HTML 内容中
<pre>
<code class="html">
<p>This is your HMTL sample</p>
<p>You can use classes like "html", "php", "css", "javascript" too..</p>
</code>
</pre>
Run Code Online (Sandbox Code Playgroud)
您可以在此处查看语言和样式。