[英]Replace spaces with Regex without replacing empty HTML tags
I wish to replace spaces in something like this: 我希望在这样的地方替换空格:
<span>5</span>SPACE<image href="mtgsymbol.png" />
but when I do so using: 但是当我这样做时:
card_cost=card_cost.replace(/\\s/g,"");
it messes my css all up and the objects stack on each other like their position is changed to absolute. 它弄乱了我的css,所有对象彼此堆叠,就像它们的位置更改为绝对位置一样。
How do I replace the spaces without breaking my css or document flow? 如何在不破坏CSS或文档流的情况下替换空格?
Example code: 示例代码:
Javascript: Javascript:
card_cost=document.getElementById('card_cost').value;
if(card_cost)
{
card_cost=card_cost.replace(/\d+/g,"<span class='card_costnum'>$&</span>");
*breaks styling*card_cost=card_cost.replace(/\s/g,"");*breaks styling*
}
document.getElementById('output').innerHTML+="<div class='card'>"+"<span class='card_cost'>"+card_cost+"</span>";
CSS: CSS:
.card_name,.card_image,.card_cost,.card_type,.card_subtype,.card_rarity,.card_rules,.card_flavor,.card_strength,.card_num,.card_lower,.card_costnum
{
position:relative;
z-index:1;
}
.card_cost
{
display:inline-block;
float:right;
clear:right;
}
.card_costnum
{
position:relative;
display:inline-block;
text-align:center;
vertical-align:middle;
background-image:url("numsymbol_small.png");
background-repeat:no-repeat;
width:12px;
height:12px;
margin:1px;
top:-4px;
}
card_cost = card_cost.replace(/\d+/g, "<span class='card_costnum'>$&</span>");
card_cost = card_cost.replace(/\s/g, "");
You're turning it into <spanclass='card_costnum'>
, which is not valid, and which will break the rest of your HTML. 您将其转换为
<spanclass='card_costnum'>
,这是无效的,并且会破坏HTML的其余部分。 Just reverse the replacements. 只需反向替换即可。
card_cost = card_cost.replace(/\s/g, "");
card_cost = card_cost.replace(/\d+/g, "<span class='card_costnum'>$&</span>");
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.