JavaScript监视事件不适用于DOM元素对象？

我知道我可以使用

watch

绑定回调，该回调将在对象属性更改时触发。这对一般对象有效，例如：

{'a':1, 'b':'7'}

因此，我认为我可以简单地绑定一个回调，当输入字段值发生变化时将触发该回调：

var inputDomElement = document.getElementById('someInputElement');
inputDomElement.watch('value',function (id, oldval, newval) {
    alert(oldval);
    alert(newval);
});

但这不起作用。根本不会触发。没有警报框。我已经在Firefox5和Google Chrome（最新版本）上试用过了

这不是

watch

的工作原理吗？watch对DOM元素不起作用吗？我以为它们只是物体，不是吗

更新1:

以下是有关观看内容的MDN信息：

更新2:

---

我无法使用更改事件。因为更改仅在文本元素捕捉模糊时触发。这意味着它只会在用户从这个文本字段切换到另一个文本字段时触发。它在任何方面都不是动态的，例如，当检查这个用户名或电子邮件地址是否已经使用时，我希望在每次不同的更改中都使用它。

您需要使用jQuery对象，而不是DOM对象。这是有区别的

document.getElementById("someID") //returns DOM Object

$('#someId')  //returns jQuery Object

注意：您可能会做出如下奇怪的行为：

$(document.getElementById("someID"))  //returns a jQuery Object

这会管用的

$('#someInputElement').watch('value',function (id, oldval, newval) {
    alert(oldval);
    alert(newval);
});

---

如果要跟踪文本元素的更改，为什么不使用.change（）方法呢

$（'input'）。更改（函数（e）{
$（'div'）.html（'旧值：'+e.target.defaultValue+'
'
+“新值：”+e.target.value）；
})

---

对于即时更改，请使用.keyup（）：

DOM是用C/C++编写的，在C/C++中，获取和设置Javascript变量的概念并不存在，正如您或我经常想象的那样。您可能想象代码的实现与下面的类似。不幸的是，

Object.watch

从未启动，因为DOM没有不断更新Javascipt值，但Javascript正在请求DOM进行更新

input.onuserchangevalue = function(){
   input.value = 'new user input'
}

考虑DOM通常是如何工作的，每个元素都有几十个潜在属性

• innerHTML

  ，

  value

  ，

  style.cssText

  ，

  name

  ，

  id

  ，

  style.backgroundColor

  ，

  style.backgroundColor

想象一下，如果DOM下划线代码必须不断地更新每个DOM元素，那么内存和CPU周期将达到极限，必须确保属性与显示值匹配。DOM的内部还必须检查Javascript值是否发生了潜在的更改

现实-红色药丸 基本上，DOM并没有向javascript提供信息，但javascript向DOM请求信息。这是一个相当不错的Javascript解释，解释了下面发生的事情

Object.defineProperty(input, "value", {
    get : function(){ /* get C/C++ DOM value */ },
    set : function(){ /* change C/C++ DOM value */ }
   });

---

这解释了为什么DOM常常是Javascript的瓶颈。每次与DOM交互时，Javascript都必须请求/设置内部DOM值。

？我不记得jQuery中有“watch”。这是一个插件吗？@Andre是的，这是一个插件。对不起，我的回答中没有提到这一点，OP的问题中也没有。我只是假设这是他用的，因为我以前用过。我明白了。我知道有几个插件，但我很想知道为什么默认的javascript watch实现不起作用：因为只有当文本元素捕捉到模糊时才会触发更改。这意味着它只会在用户从这个文本字段切换到另一个文本字段时触发。它在任何方面都不是动态的，例如检查这个用户名或电子邮件地址是否已经使用了每次更改时希望使用的Id。例如，看看google或yahoo的注册页面。@Andre:那么使用.keyup怎么样？检查更新后的帖子是的-我怀疑这将是你提供的下一件事：）问题是-想想有多少方法可以更改输入字段：1）按键2）通过上下文菜单或键盘快捷键复制/粘贴3）输入值用JavaScript修改4）由浏览器或某个浏览器插件自动完成。只跟踪最终结果比跟踪所有方法更容易。watch方法确实是跟踪任何值更改的最佳方法。我试图回答的唯一问题是-为什么原生监视方式不适用于DOM元素。尽管我可以很容易地使用一些pugins，比如：没有一个用于DOM元素值的pugins。在这件事上相信我。我花了一些时间四处挖掘，最终编写了自己的jQuery插件。如果正确实现，轮询就可以了。如果你感兴趣的话（非常简单）：MDN页面顶部的横幅上有黄色的“非标准”。这也许可以解释为什么它不起作用。它在所有现代浏览器中都起作用：Firefox3+、Google Chrome、IE 9+、SAFARI v。4+. 另外-我在问题中提到我在支持浏览器方面尝试过它。请不要继续用“仍在等待”的更改来更新您的原始问题。没有被接受的答案意味着你在寻找正确的答案。您不需要继续“颠簸”您的问题。您使用.watch（）的方式以及MDN文章示例中显示的方式—他们正在监视用javascript创建的javascript对象，而不是DOM对象。我确实遇到了这个问题，它可能会帮助您实现您想要做的事情：@Alexander问题在于底层DOM是如何实现的，而不是如何使用

Object.defineProperty

vs

\uu defineGeter\uuuu/\uuu defineSetter\uuu

。我在上面放了Javascript示例来演示它是如何在内部工作的。对不起，我认为我最初的评论不清楚。我完全同意你的意见，并投了赞成票。：）这篇评论是对你的回答的补充，是针对安德烈的。很遗憾，编辑原始评论的时间已经过去了。@Lime:谢谢。所以-这个故事的寓意是，DOM API和JS API是不同的东西，当一个人使用getElementById创建JS对象时-这将简单地从DOM元素获取“立即数据”，

Object.defineProperty(input, "value", {
    get : function(){ /* get C/C++ DOM value */ },
    set : function(){ /* change C/C++ DOM value */ }
   });