html正则表达式的代码,用正则表达式格式化html标签的代码

这段代码展示了如何创建一个具有特定样式的文本编辑器。编辑器包括颜色设置、字体选择、行高调整等功能,并能处理文本换行和HTML标签。通过点击不同ID的span元素,可以触发不同的弹窗提示。代码还包含一个处理文本内容的函数,用于替换和清理文本中的特定模式。
摘要由CSDN通过智能技术生成

#x_edit{

height:320px;

width:540px;

border:1px solid #666666;

color:red;

filter:chroma(color="#0f0f0f");

background-color:#f0f0f0;

font-family:verdana;

font-size:11px;

line-height:13px;

margin-left:16px;

overflow:scroll;

border-left:none;

scrollbar-arrow-color:#666666;

scrollbar-base-color:#666666;

scrollbar-darkshadow-color:#f0f0f0;

scrollbar-face-color:#f0f0f0;

}

格式化

<html>
<head>
</head>
<body>
<style>
#x_edit,#x_edit1{
  height:320px;
  width:540px;
  border:1px solid #666666;

  color:red;

  filter:chroma(color="#0f0f0f");
  background-color:#f0f0f0;
  font-family:verdana;
  font-size:11px;
  line-height:13px;
  margin-left:16px;
  overflow:scroll;
  border-left:none;
  scrollbar-arrow-color:#666666;
  scrollbar-base-color:#666666;
  scrollbar-darkshadow-color:#f0f0f0;
  scrollbar-face-color:#f0f0f0;
  }
</style>
<span οnclick="abc()">试试获得selection的top,然后加上div的scrollTop,然后除以行高</span>
<span id="a" οnclick="alert('a')">a</span>
<span id="b" οnclick="alert('b')">b</span>
<span id="c" οnclick="alert('c')"
>c</span>
<span id="d" οnclick="alert('d')">d</span>
<span id="e" οnclick="alert('e')">e</span>
<span id="f" οnclick="alert('f')">f</span
>
<span id="g"
 οnclick="alert('g')">g</span>
<textarea id="x_edit" wrap=off></textarea>
<div contentEditable="true" id="x_edit1" style='position:relative;line-height:13px;background-color:#f0f0f0;filter:Chroma(color=#FDFEFF);width:540px;height:320px;overflow:auto;white-space: nowrap; z-index: 2;border:0px'></div>
<script>
function abc(){
    //s=x_edit1.innerText;
    var s=x_edit.value;
    s=s.replace(/\n/gi,"");
    //s=s.replace(/<(\w+)(.*?)[^<>]>/gi,"<"+aaa("$1$2")+">");
    s=s.replace(/<(.*?)[^<>]>/gi,"<"+aaa("$1")+">");
    s=s.replace(/\n/gi,"@");
    //var LineValue=x_edit1.innerText.split("\r")
    /*var LineValue=x_edit.value.split("\r")
for(var i=0;i<LineValue.length;i++){
    LineValue[i]=LineValue[i].replace(/(".*")/gi,"$1".replace(/</gi,"\xef").replace(/>/gi,"\xff"))
    LineValue[i]=LineValue[i].replace(/<(.*[^<>])>/gi,"<"+"$1"+">\r")
    LineValue[i]=LineValue[i].replace(/\r\r/gi,"\r")
    LineValue[i]=LineValue[i].replace(/(".*")/gi,"$1".replace(/\xef/gi,"<").replace(/\xff/gi,">"))
}*/
    //x_edit1.innerText=LineValue.join("");
    //x_edit.value=LineValue.join("");
    x_edit.value=s;
    //x_edit1.innerText=s;
}
function aaa(str){
    str=str.replace(/\r/gi," ");
    return str;
}
</script>
</body>
</html>

function abc(){

var s=x_edit.innerText;

s=s.replace(//gi,function(a){return a.replace(/[\r\n]/gi,"")});

x_edit.innerText=s;

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值