js 正则表达式

时间：2022-11-20 21:05:56
请教如何将以下字符串 
LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;


变为 
{"WIDTH":"40px","HEIGHT":"40px"}


正则式不怎么会写，请大家帮忙看看。用split（","）分割后不知道怎么操作。

11 个解决方案

#1

主要是去掉  
LEFT: 316px;POSITION: absolute; TOP: 69px;

#2

<script>

var str="LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;"

str=str.match(/(width|height):[^;]+/gi);

str="{"+str.join(",")+"}";

alert(str);

</script>

#3

var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;";

var prop = {};

var names = ["WIDTH", "HEIGHT"];

for (var i = 0; i < names.length; i++) {

    var match = str.match(new RegExp("\\b" + names[i] + "\\s*:\\s*(\\d+px)\\s*;?", "i"));

    if (match) prop[names[i]] = match[1]; 

}


document.open();

for(var p in prop) {

    document.write(p);

    document.write("=");

    document.write(prop[p]);

    document.write("<br/>");

}

document.close();

#4



 <div id="div1"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

	var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;";

	if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

	str = "\"" + str + "\"";

	var reg = /\s/g

	str = str.replace(reg,"");

	reg = /;/g

	str = str.replace(reg,"\",\"");

	reg = /:/g

	str = str.replace(reg,"\":\"");

	div1.innerHTML = str;

//-->

</SCRIPT>

#5

非常感谢各位，速度太快了。能将功能完善一下更好了。只是想去掉style里的
absolute; TOP: 69px; LEFT: 316px; 
style里并不单纯的只有height 和 width 。
前两位朋友的都是采用匹配 height 和width ，
zyzy15  好像只是变成我需要的那种格式而没有去掉style中的一些元素。

谢谢，请各位再帮忙修改下~~不甚感激。呵呵

#6

如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;  
的去掉，余下的就可以了。哈哈 个人想法。

#7

引用 6 楼 jakbb 的回复:
如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;  
的去掉，余下的就可以了。哈哈 个人想法。

哦，是这个意思啊 


<div id="div1"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; top: 69px; HEIGHT:40px;";

    var reg = /\s/g

    str = str.replace(reg,"");

    reg = /(POSITION|TOP|LEFT).*?;/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{\"" + str + "\"}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    div1.innerHTML = str;

//-->

</SCRIPT>

#8

呵呵，谢谢各位了。

#9

引用 7 楼 zyzy15 的回复:
引用 6 楼 jakbb 的回复:
如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;
的去掉，余下的就可以了。哈哈 个人想法。

哦，是这个意思啊

HTML code

<div id="div1"></div>
<SCRIPT LANGUAGE="JavaScript">
<!--
    var st……


直接运行是正确的，可是在IE8 跟firefox下有一个BUG，IE下LEFT 是去不掉的，firefox可以的。

以下是我的代码： 



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD><TITLE>样式获取!</TITLE>

<META http-equiv=Content-Type content="text/html; charset=gb2312">

    <title>jQuery</title>

    <head>

	<script type="text/javascript" src="js/jquery.js"></script>	

<SCRIPT LANGUAGE="JavaScript">

<!--

$(document).ready(function(){

    var str = $("#hello").attr("style");

	alert(str);

    var reg = /\s/g

    str = str.replace(reg,"");

    reg = /(left|POSITION|TOP|LEFT).*?;/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{\"" + str + "\"}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    alert(str);

		})

</SCRIPT>

</HEAD>

<body>

<div id="hello" style="WIDTH:40px; POSITION: absolute; top: 69px; HEIGHT:40px;LEFT: 316px;"></div>

</body>

</HTML>

请大家再帮忙看看~~~ 谢谢

#10

参考这个再试试 


<div id="hello" style="WIDTH:40px; POSITION: absolute; top: 69px;LEFT: 316px; HEIGHT:40px;"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var str = document.getElementById("hello").getAttribute("style");

	//ie取到的style是个object，ff取到的是string

	if (typeof(str)=="object")

	{

		//ie的情况，取div的outerHTML，再进行匹配

		str = document.getElementById("hello").getAttribute("outerHTML");

		str = str.match(/style=\".*?\"/);

		str = str.toString().substring(6);

	}

    alert(str);

    var reg = /\s/g

    str = str.replace(reg,"");

    //left去不掉是因为取到的style的最后一个";"被不知啥玩意儿给吃了

    //所以改成：有";"到";"，没有则到末尾

    reg = /(left|POSITION|TOP|LEFT).*?(;|$)/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{" + str + "}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    alert(str);

</SCRIPT>

#11

恩，非常谢谢你。后来我又另外发了一个帖子，别人也是帮我这么解决的。看来我得好好学学正则式。感谢~！

#1

主要是去掉  
LEFT: 316px;POSITION: absolute; TOP: 69px;

#2

<script>

var str="LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;"

str=str.match(/(width|height):[^;]+/gi);

str="{"+str.join(",")+"}";

alert(str);

</script>

#3

var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;";

var prop = {};

var names = ["WIDTH", "HEIGHT"];

for (var i = 0; i < names.length; i++) {

    var match = str.match(new RegExp("\\b" + names[i] + "\\s*:\\s*(\\d+px)\\s*;?", "i"));

    if (match) prop[names[i]] = match[1]; 

}


document.open();

for(var p in prop) {

    document.write(p);

    document.write("=");

    document.write(prop[p]);

    document.write("<br/>");

}

document.close();

#4



 <div id="div1"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

	var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; TOP: 69px; HEIGHT:40px;";

	if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

	str = "\"" + str + "\"";

	var reg = /\s/g

	str = str.replace(reg,"");

	reg = /;/g

	str = str.replace(reg,"\",\"");

	reg = /:/g

	str = str.replace(reg,"\":\"");

	div1.innerHTML = str;

//-->

</SCRIPT>

#5

非常感谢各位，速度太快了。能将功能完善一下更好了。只是想去掉style里的
absolute; TOP: 69px; LEFT: 316px; 
style里并不单纯的只有height 和 width 。
前两位朋友的都是采用匹配 height 和width ，
zyzy15  好像只是变成我需要的那种格式而没有去掉style中的一些元素。

谢谢，请各位再帮忙修改下~~不甚感激。呵呵

#6

如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;  
的去掉，余下的就可以了。哈哈 个人想法。

#7

引用 6 楼 jakbb 的回复:
如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;  
的去掉，余下的就可以了。哈哈 个人想法。

哦，是这个意思啊 


<div id="div1"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var str = "LEFT: 316px; WIDTH:40px; POSITION: absolute; top: 69px; HEIGHT:40px;";

    var reg = /\s/g

    str = str.replace(reg,"");

    reg = /(POSITION|TOP|LEFT).*?;/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{\"" + str + "\"}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    div1.innerHTML = str;

//-->

</SCRIPT>

#8

呵呵，谢谢各位了。

#9

引用 7 楼 zyzy15 的回复:
引用 6 楼 jakbb 的回复:
如果前两位朋友采用逆向思维去写或许比较好一点，将匹配absolute; TOP: 69px; LEFT: 316px;
的去掉，余下的就可以了。哈哈 个人想法。

哦，是这个意思啊

HTML code

<div id="div1"></div>
<SCRIPT LANGUAGE="JavaScript">
<!--
    var st……


直接运行是正确的，可是在IE8 跟firefox下有一个BUG，IE下LEFT 是去不掉的，firefox可以的。

以下是我的代码： 



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML><HEAD><TITLE>样式获取!</TITLE>

<META http-equiv=Content-Type content="text/html; charset=gb2312">

    <title>jQuery</title>

    <head>

	<script type="text/javascript" src="js/jquery.js"></script>	

<SCRIPT LANGUAGE="JavaScript">

<!--

$(document).ready(function(){

    var str = $("#hello").attr("style");

	alert(str);

    var reg = /\s/g

    str = str.replace(reg,"");

    reg = /(left|POSITION|TOP|LEFT).*?;/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{\"" + str + "\"}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    alert(str);

		})

</SCRIPT>

</HEAD>

<body>

<div id="hello" style="WIDTH:40px; POSITION: absolute; top: 69px; HEIGHT:40px;LEFT: 316px;"></div>

</body>

</HTML>

请大家再帮忙看看~~~ 谢谢

#10

参考这个再试试 


<div id="hello" style="WIDTH:40px; POSITION: absolute; top: 69px;LEFT: 316px; HEIGHT:40px;"></div>

<SCRIPT LANGUAGE="JavaScript">

<!--

    var str = document.getElementById("hello").getAttribute("style");

	//ie取到的style是个object，ff取到的是string

	if (typeof(str)=="object")

	{

		//ie的情况，取div的outerHTML，再进行匹配

		str = document.getElementById("hello").getAttribute("outerHTML");

		str = str.match(/style=\".*?\"/);

		str = str.toString().substring(6);

	}

    alert(str);

    var reg = /\s/g

    str = str.replace(reg,"");

    //left去不掉是因为取到的style的最后一个";"被不知啥玩意儿给吃了

    //所以改成：有";"到";"，没有则到末尾

    reg = /(left|POSITION|TOP|LEFT).*?(;|$)/ig

    str = str.replace(reg,"");

    if (str.substring(str.length-1)==";") str = str.substring(0,str.length-1);

    str = "{" + str + "}";

    reg = /;/g

    str = str.replace(reg,"\",\"");

    reg = /:/g

    str = str.replace(reg,"\":\"");

    alert(str);

</SCRIPT>

#11

恩，非常谢谢你。后来我又另外发了一个帖子，别人也是帮我这么解决的。看来我得好好学学正则式。感谢~！
标签：

相关文章