JavaScript显示系统时间,显示年月日时分秒和星期,每秒自动刷新,并加入日期颜色区别:
- 星期一至星期五显示为黑色
- 星期六显示为绿色
- 星期日显示为红色
提示:你可以先修改部分代码再运行。
JavaScript显示系统时间,显示年月日时分秒和星期,每秒自动刷新,并加入日期颜色区别:
提示:你可以先修改部分代码再运行。
SyntaxHighlighter是一款用JavaScript编写的功能强大的代码高亮显示工具,它可以在网页中对各种程序源代码语法进行高亮显示。当前最新版本是2.0.296,目前支持的编程语言为:Bash/shell、C#、C++、CSS、Delphi、Diff、Groovy、JavaScript、Java、Perl、PHP、Plain Text、Python、Ruby、Scala、SQL、Visual Basic、XML/XHTML/XSLT/HTML。
演示地址:http://alexgorbatchev.com/wiki/SyntaxHighlighter:Demo
下载地址:http://alexgorbatchev.com/wiki/SyntaxHighlighter:Download
安装方法:
<link type="text/css" rel="stylesheet" href="/SyntaxHighlighter/styles/shCore.css"/> <link type="text/css" rel="stylesheet" href="/SyntaxHighlighter/styles/shThemeDefault.css"/>
其实就是载入两个CSS文件,其中第二行载入的shThemeDefault.css是默认的样式,在SyntaxHighlighter目录的styles目录中一共提供了6个样式文件,分别是shThemeDefault.css、shThemeDjango.css、shThemeEmacs.css、shThemeFadeToGrey.css、shThemeMidnight.css、shThemeRDark.css,可以根据自己喜欢的样式来载入不同的样式文件。
<script src="/SyntaxHighlighter/scripts/shCore.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushBash.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushCpp.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushCSharp.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushCss.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushDelphi.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushDiff.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushGroovy.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushJava.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushJScript.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushPerl.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushPhp.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushPlain.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushPython.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushRuby.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushScala.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushSql.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushVb.js" type="text/javascript"></script> <script src="/SyntaxHighlighter/scripts/shBrushXml.js" type="text/javascript"></script> <script type="text/javascript"> SyntaxHighlighter.config.clipboardSwf = '/SyntaxHighlighter/scripts/clipboard.swf'; SyntaxHighlighter.all(); </script>
在以上代码载入的19个js文件中,除了第一个shCore.js外,其他的都是每个js文件对应一种编程语言(根据文件名可以判断支持哪种编程语言),可以根据实际需要来选择是否载入。
<pre class="brush: c-sharp;">
function test() : String
{
return 10;
}
</pre>
其中c-sharp是定义编程语言的类型,关于其他类型编程语言的定义方法,详见下表的Brush aliases列:
| Brush name | Brush aliases | File name |
|---|---|---|
| Bash/shell | bash, shell | shBrushBash.js |
| C# | c-sharp, csharp | shBrushCSharp.js |
| C++ | cpp, c | shBrushCpp.js |
| CSS | css | shBrushCss.js |
| Delphi | delphi, pas, pascal | shBrushDelphi.js |
| Diff | diff, patch | shBrushDiff.js |
| Groovy | groovy | shBrushGroovy.js |
| JavaScript | js, jscript, javascript | shBrushJScript.js |
| Java | java | shBrushJava.js |
| Perl | perl, pl | shBrushPerl.js |
| PHP | php | shBrushPhp.js |
| Plain Text | plain, text | shBrushPlain.js |
| Python | py, python | shBrushPython.js |
| Ruby | rails, ror, ruby | shBrushRuby.js |
| Scala | scala | shBrushScala.js |
| SQL | sql | shBrushSql.js |
| Visual Basic | vb, vbnet | shBrushVb.js |
| XML | xml, xhtml, xslt, html, xhtml | shBrushXml.js |
以下是HTML代码显示效果:
<html> <head> <title>SyntaxHighlighter</title> </head> <body> </body> </html>
以下是PHP代码显示效果:
$today = date("F j, Y, g:i a");
$today = date("m.d.y");
$today = date("j, n, Y");
$today = date("Ymd");
$today = date('h-i-s, j-m-y, it is w Day z ');
$today = date('\i\t \i\s \t\h\e jS \d\a\y.');
$today = date("D M j G:i:s T Y");
$today = date('H:m:s \m \i\s\ \m\o\n\t\h');
$today = date("H:i:s");
由于这个Theme开始写的时间就是以XHTML 1.0 Transitional写的,现在要更改为XHTML 1.0 Strict,相对来讲,不是太复杂。 经过简单的调试、修改,本站的THeme已完全达到 XHTML 1.0 Strict 的标准,并已经通过W3C的检查(点击页面最下面的W3C检查图标即可查看)。
在修改过程中,遇到以下三个问题:
1、XHTML 1.0 Strict 不支持a标签的target属性,也就是无法强制在新窗口打开网页。经过查找资料显示,W3C一直不提倡使用target这个属性,W3C认为是否在新窗口打开链接应该由用户去选择,而不是强制用户在新窗口里打开,这样很容易就导致一下子开太多的窗口,造成浏览器占用过多的系统资源。
解决办法:以对用户的尊重和遵循W3C标准为目的,放弃使用target属性,如果你想在新窗口打开的话,只能右击鼠标了。
2、XHTML 1.0 Strict 不支持img标签的border属性。
解决办法:在CSS里控制就可以了,如果你要网页上所有图片的边框为0的话,在CSS里加上如下代码(红色部分):img{ border:0;}
3、XHTML 1.0 Strict 不支持script标签的language属性。
解决办法:将<script type="text/javascript" language="javascript">改为<script type="text/javascript">,就是将language="javascript"去掉即可。
欢迎使用 WordPress 。这是系统自动生成的演示文章。编辑或者删除它,开始您的博客!