如何在Javascript中添加百分比

Question

我试图通过向每张图片添加100％来制作滑块，但却无法完成。 我的主要问题是如何添加百分比。我试过console.log（100％+ 100％）只是为了一个例子而且它也不起作用。谢谢你的任何建议。

<section class="slider">
<img class="img" id="img1" src="girl.jpg" alt="" style="left: -100%">
<img class="img" id="img2" src="sport.jpg" alt="" style="left: 200%" >
<img class="img" id="img3" src="biceps.jpg" alt="" style="left: 100%" >
<img class="img" id="img4" src="weights.jpg" alt="" style="left: 0%">
</section>

的javascript

var img = document.getElementsByClassName('img');

function slide() {
for(i=0; i < img.length; i++) {
img[i].style.left += "100%";
console.log(img[i].style.left);

 }
}

Answer 1

您不能，因为此属性的值不是数字（它是文本）。那么你可以做什么： 尝试解析文本以仅获取数字部分，将其解析为整数，进行数学运算，然后将其转换回字符串。像

这样的东西

let tempPercent = parseInt(img[i].style.left.replace('%', ''), 10); tempPercent += 100; img[i].style.left = tempPercent+'%';