javascript - 如何获取元素的新值？ - JavaScript

Question

抱歉，我是 JavaScript 初学者，这个问题肯定已经有人问过，但我没有找到任何答案。 我认为这很简单，但我这样做了:

<h1 onclick="up()" id="titre">Le texte du titre</h1>
<div id="div">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
<img src="Koala.jpg">
<script type="text/javascript">
    function descend() {
        var cour = document.getElementById("div").style.marginTop;
        var cour = (cour+50);
        document.getElementById("div").style.marginTop = cour;
    }

    function up() {
        setInterval(descend, 2000);
    }
</script>

因此，在这个脚本中，当我单击 H1 时，我启动函数 up() ，该函数以 2 秒的间隔启动函数 descend() 。问题是当我在第二回合获得 marginTop 值时，它不会增加。 (我知道我还有另一个小问题。我需要以 px 表示新值) 我怎样才能做到这一点 ？ 谢谢

Answer 1

marginTop 将返回带有 px 后缀的值。所以你将无法执行(cour + 50)。 parseInt 会帮助你。

var cour = parseInt(document.getElementById("div").style.marginTop, 10)

marginTop 将返回 '50px'，而 parseInt 会将其转换为 50。