网站首页
关于深山
客户案例
业务范围
联系深山
网络投票系统
企业网站建设
旅行社网站建设
小程序
留言板
技术文章
许愿墙(qq爱墙)
技术首页
百度小程序开发
微信小程序开发
微信公众号开发
uni-app
asp函数库
ASP
asp.net
DIV+CSS
HTML
SEO搜索引擎忧化
下载类信息
个人空间
代码生成
电商
python
页面特效
表格特效
导航菜单
图形特效
表单特效
时间日期
色彩类别
链接特效
网页特效
系统硬件
网站公告
网页学习
技术类文章
网站类信息
订阅本栏目 RSS
您所在的位置:
深山工作室
>
DIV+CSS
> 正文
Javascript实现CSS代码高亮显示
深山行者个人网站 2009/12/22 14:07:43 深山行者 字体:
大
中
小
浏览 10475
以下为详细代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>Javascript实现CSS代码高亮显示1</title> <style type="text/css"> /* */ body{ font-size:12px; line-height:1.8; font-family:'Courier New', Courier, monospace; } #area{ width:320px; height:120px; } </style> </head> <body> <textarea id="area"> body{ font-size:12px; line-height:1.8; font-family:'微软雅黑'; } /* web:http://www.dovapour.com.cn/ mail:dovapour@gmail.com QQ:362380046 */ #area{ width:320px; height:120px; line-height:1.5; font-family:"Courier New", Courier, monospace; } /* ul{ margin:0; padding:0; list-style:none; } table{ border-collapse:collapse; border-spacing:0; } */ </textarea> <button id="btn">测试</button> <div id="pre" style="color:#F0F;"></div> <script type="text/javascript"> function $(id) { return document.getElementById(id); }; $("btn").onclick=function(){ var code=$("area").value; //处理注释:注释替换成 _数字_ var startIdx=endIndex=-1; var at=0; var commentList=[]; while(true){ startIndex=code.indexOf("/*",at); if(startIndex==-1)break; endIndex=code.indexOf("*/",startIndex); if(endIndex==-1)break; at=endIndex+2; commentList.push(code.substring(startIndex,at)); code=code.replace(commentList[commentList.length-1],"_"+(commentList.length-1)+"_"); } //字符串 code=code.replace(/(['"]).*\1/g,function(m){return "<span style=\"color:#060;\">"+m+"</span>"}); //CSS样式值 code=code.replace(/:(.+);/g,function(m,n){return ":<span style=\"color:#00F;\">"+n+"</span>;"}); //CSS样式名称 code=code.replace(/[{}]/g,function(m){ if(m=="{"){ return "{<span style=\"color:#006;\">"; }else{ return "</span>}"; } }); //注释 code=code.replace(/_(\d+)_/g,function(m,n){return "<span style=\"color:#999;\">"+commentList[n]+"</span>"}); //处理\t code=code.replace(/^(\t+)/gm,function(m){ return (new Array(m.length+1)).join(" "); }); //处理空格 code=code.replace(/^( +)/gm, function(m) { return (new Array(m.length + 1)).join(" "); }); //处理换行 code=code.replace(/\r?\n/g,"<br />"); $("pre").innerHTML=code; } </script> </body> </html>
前一页:
IE中奇怪的左右border断线现象
后一页:
仿taobao效果拼音字母检索功能
相关阅读
竖排的选项卡
Instagram 广告投放操作与技巧
一个不错的分页效果
实时输入数字自动转换为货币形式并计算
安卓版微信中播放视频不自动全屏
中国签证行业领导者--91出国签证网
酷在旅途
走四方旅行社
更多信息>>
栏目类别选择
百度小程序开发
微信小程序开发
微信公众号开发
uni-app
asp函数库
ASP
DIV+CSS
HTML
python
更多>>
同类信息
jquery设置或获取修改classname
利用css3.0写出一个音乐播放的唱片碟盘的效果
利用css中的scale()实现放大缩小效果
利用background-color:#000000a8在背景颜色16进制代码之后加字母加上数字让背景色透明
css背景使用base64编码或者将base64编码放在img图片标签中
利用css3中的-webkit-font-smoothing把网页文字的毛边去掉
更多>>
最新添加文章
dw里面查找替换使用正则删除sqlserver里面的CONSTRAINT
Android移动端自动化测试:使用UIAutomatorViewer与Selenium定位元素
抖音直播音挂载小雪花 懂车帝小程序
javascript获取浏览器指纹可以用来做投票
火狐Mozilla Firefox出现:无法载入您的Firefox配置文件 它可能已经丢失 或是无法访问 问题解决集合处理办法
在Android、iOS、Windows、MacOS中微信小程序的文件存放路径
python通过代码修改pip下载源让下载库飞起
python里面requests.post返回的res.text还有其它的吗
更多>>
随机抽取信息
正则替换回车换行符和把br替换成回车换行符
支持火狐,IE6.ie7.ie8.ie9的加入收藏/设为首页代码
诸城市龙马假日旅行社
Instagram 广告投放操作与技巧
留言板留言板V7.0
发布重大事件说明
更多标签
热门标签
源码
电脑
换行
获取
弹窗
爱国
工作室
文件
边框
随机
告
顶部
定制
等高
Application
打字
倒计时
圆角
表格
刷新
柱状图
adobe
压缩
ie5.5
高亮
论坛
图片
类别
管理系统
数据
sel 框
固定
清除
浮动
表达式
盖楼
网页
多选框
调色器
用户体验
email
脚本
容器
对象
无限
滚动条
max
dw 访问量
自适应
数组
免责声明:本站所有资料信息,有部分为本人原创,部分为从网络收集而来,仅供网友查看阅读所用,所有信息版权归信息所有人或所有公司所有
如果信息内容侵犯到您的版权或权益请与我们联系,经确认后我们会立即移除相关内容或链接
Copyright © 2007-2026
深山工作室
All Rights Reserved
服务QQ:
565449214
手机:
13961347334
ICP备案:
苏ICP备15019627号
苏公网安备 32070502010230号