尝试通过 JavaScript 从字符串中删除一些字符

Question

我有一个解析 SVG 图像的脚本。例如，我正在尝试解析名为 "opacity" 的属性并删除句点和零，而不是在它等于“0.8”时添加一个零。不过，数字 8 可以是任何小于 10 的数字。所以基本上如果它以“0”开头。删除它并在“8”之后添加一个“0”。

假设不透明度值为“0.8”，我希望它删除“0”。并在“8”后加“0”。这将使它成为“80”。

当不透明度值为“1.0”时，删除“.0”并添加两个“0"s after the 1. Which would make it "100”

这里有 2 个 SVG 元素的例子。

<polyline points="425,311 425,312 425,312 424,314 424,314 424,317 424,317 424,322 424,322 424,326 424,326 424,328 424,328 424,329 424,331 423,332 423,333 423,334 423,335 423,336 423,338 423,341 423,342 423,344 423,348 423,350 423,353 423,355 423,357 423,358 423,359 423,360 423,363 423,364 423,365 424,367 424,370 424,372 424,374 425,378 426,383 426,387 426,389 427,393 428,397 428,401 428,403 428,409 429,414 430,419 431,422 431,427 432,431 432,434 432,435 433,437 433,438 433,439 433,440 433,441 433,442 433,443 433,444 433,446 433,448 433,449 433,450 433,451 433,453 433,454 433,455 433,456 433,457 433,458 432,459 432,461 432,462 431,463 430,464 429,466 428,467 428,469 428,471 427,471 427,472 427,473 426,474 425,475 425,476 424,479 424,481 424,486 424,489 424,491 424,492 424,493 424,494 424,495" style="fill: none; stroke: #963cd3; stroke-width: 5; stroke-linejoin: round; stroke-linecap: round; stroke-antialiasing: false; stroke-antialias: 0; opacity: 0.8"/>

<polyline points="74,189 74,190 74,190 74,191 75,191 75,192 76,192 76,193 77,193 77,194 78,194 78,195 79,195 79,196 80,196 80,197 81,197 81,198 82,198 82,199 83,199 83,200 84,201 85,201 85,202 86,202 86,203 87,204 88,205 89,205 89,206 90,206 91,206 91,207 92,207 92,208 93,208 93,209 94,209 95,209 95,210 96,210 96,211 97,211 98,212 99,212 100,213 101,214 102,214 103,214 103,215 104,215 105,215 105,216 106,216 107,216 108,216 108,217 109,217 110,217 111,217 112,218 113,218 114,218 115,218 116,218 117,218 118,218 118,217" style="fill: none; stroke: #000000; stroke-width: 1; stroke-linejoin: round; stroke-linecap: round; stroke-antialiasing: false; stroke-antialias: 0; opacity: 1.0"/>

如您所见，其中一个元素的 "opacity" 属性值为“1.0”，另一个为“0.8”。

因此，当我的脚本将值记录到控制台时。我需要他们像这样打印

对于第一个元素，它将记录“80”

第二次它将记录“100”。

我试过这样做，但认为它会起作用，但不行。

if (opacity === "1.0")
{
opacity.replace(".0", "00")
$.post("/draw.php?ing=_index", {
            l: ((JSON.stringify(line.getAttribute('points').split(' ').map(pair => pair.split(',').map(Number))))),
            w: (size),
            c: (color),
            o: ("100"),
            f: ("1"),
            _: ("true")
 })
}
else
{
opacity.replace("0.", "") + "0"
$.post("/draw.php?ing=_index", {
            l: ((JSON.stringify(line.getAttribute('points').split(' ').map(pair => pair.split(',').map(Number))))),
            w: (size),
            c: (color),
            o: ("100"),
            f: ("1"),
            _: ("true")
 })
console.log(opacity)
}

Answer 1

Javascript 的 replace 函数 returns 一个新的字符串并且不会就地编辑字符串。

所以你的代码应该这样做

opacity = opacity.replace(".0", "00");

另一种解决方案可能是利用 javascript 的弱类型系统并执行以下操作。


opacity = opacity * 100;
$.post("/draw.php?ing=_index", {
            l: ((JSON.stringify(line.getAttribute('points').split(' ').map(pair => pair.split(',').map(Number))))),
            w: (size),
            c: (color),
            o: ("100"),
            f: ("1"),
            _: ("true")
 });
console.log(opacity);

无论 opacity 是像 0.8 这样的数字还是像 '0.8'

这样的字符串，这都会起作用

Answer 2

您似乎对 String.replace 的工作原理有误解。此外，行尾的分号没有区别。

opacity.replace() 不修改字符串。相反，它 returns 替换了字符的字符串。

尝试将 opacity = 添加到语句的开头。

另一种方法（IMO）更具可读性，是将字符串解析为浮点数（可以包含小数部分的数字），然后将其乘以 100 将其转换为百分比.

opacity = 100 * parseFloat(opacity);

或者如果不透明度确实需要是一个字符串

opacity = (100 * parseFloat(opacity)).toString();

Answer 3

内联 CSS 属性可以用 element style 属性 :

var el = document.getElementsByTagName('polyline')[0];

if (el.style.opacity <= 1) 
  el.style.opacity *= 100;

console.log(el);

<polyline style="opacity: 0.8;"/>

尝试通过 JavaScript 从字符串中删除一些字符

Trying to remove some characters from a string via JavaScript

javascript

tampermonkey