0 - Start.html

<!DOCTYPE html>
<html>
    <head>
        <script src="https://d3js.org/d3.v5.min.js"></script>
        <meta charset="utf-8" />
    </head>
    <body>
        <input id="i1" type="number" onkeyup="i1changed()" />
        <input id="i2" type="number" onkeyup="i2changed()" />
        <button onclick="increase()">Increase</button>
    </body>
    <script>
        function i1changed() {
            const value = d3.select("#i1").node().value;
            d3.select("#i2").node().value = +value + 2;
        }

        function i2changed() {
            const value = d3.select("#i2").node().value;
            d3.select("#i1").node().value = +value - 2;
        }
        function increase() {
            const value = d3.select("#i1").node().value;
            d3.select("#i1").node().value = +value + 1;
            d3.select("#i2").node().value = +value + 3;
        }
    </script>
</html>