javascript - 纯 JS 中的两种方式数据绑定(bind)？

Question

<分区>

Answer 1

您可以尝试以下方法:

let el = document.getElementById('output');
let input = document.getElementById('input');
let price = document.getElementById('price');

function change () {
  el.innerText = input.value;
  let priceAmount = parseInt(price.innerText);
  priceAmount += 5;
  price.innerText = priceAmount;
  
}

<input type="text" oninput="change()" id="input"/>

<br>

<span id="output"></span>

<br>

<span id="price">0</span>

它使用oninput DOM事件，每次调用函数change，每次根据元素的输入更新span元素。