内部的onchange事件是否侦听setter的元素访问器？

Question

我知道，要注册我们自己的elementType，我们使用

Object.defineProperties(ElementPrototype,{
 get: function(){

 },
 set: function(newVal) {

 }
});

现在，只要我不附加onchange侦听器，它就可以很好地用于value属性，但是如果我这样做，则永远不会调用此setter，我能想到的一个原因是，此onchange在内部覆盖了我的setter并放了自己的setter，这导致了到我的二传手永远不会被调用。 这样做

elem.value = "newvalue";

不会触发我的设置器功能。 所以

首先，我的结论正确吗？

第二个解决方法是什么？

编辑：-假设ElementType是我自己的Element副本，我没有尝试修改现有的Tag Element，

Answer 1

仅需要宿主对象才能为ECMAScript功能提供最少的支持。 请参阅ECMAScript§4 ：“ ...主机对象，其说明和行为超出了本规范的范围，只是指出它们可以提供某些可以访问的属性以及可以从ECMAScript程序调用的某些功能 ”。

例如，不需要浏览器支持DOM对象的原型继承（尽管大多数都支持）。 在ECMA-262的各个部分中如何对宿主对象进行特殊处理（例如typeof运算符）方面也很明显。

底线是不需要宿主对象支持ECMAScript的所有功能，您只应期望它们支持它们通过已发布的文档提供的功能。

更普遍地说，有一个原则是您不应该弄乱自己不拥有的对象。 也就是说，除非您有明确的权限，否则请不要将属性和行为添加到宿主，内置对象或其他脚本对象。 主要原因是：

主机对象可以在不同的主机中以不同的方式实现，因此在一个主机中“起作用”的东西在另一个主机中可能不会（或引发错误）。
脚本添加的功能可能会在主机环境的更高版本中添加，从而导致不容易解决的冲突（例如，在ECMAScript ed 3是规范时引入的jQuery的每种方法，具有不同的名称并采用不同的参数顺序比ES5 forEach方法要晚，稍后介绍）
如果由第三方脚本修改主机或内置的对象变成德严谨 ，功能测试将变得异常困难。 测试功能很容易，但是判断要处理的特定功能的实现方式（例如参数的顺序和数量）却不那么容易，进一步增加了复杂性。

有时修改其他本机对象是可以的，例如，如果您有一个插件，则它可能具有可以修改的设置或参数对象，但是您不应该替换整个方法。

如果要扩展主机对象的行为，请创建一个代理并使用它。

Answer 2

我可能是错的，但似乎您想做的是在更改其value属性时在自定义元素上触发一个change事件。 这就是您可以做到的。

定义组件

xtag.register('my-element', {
    accessors: {
        value: {
            attribute: {},
            get: function () {
                return this._value;
            },
            set: function (v) {
                if (v === this._value) return; // unchanged

                var change = { from: this._value, to: v }; // optional

                this._value = v; // set new value

                xtag.fireEvent(this, 'change', { // event
                    detail: change,
                    bubbles: true,
                    cancelable: true
                });
            }
        }
    }
});

的HTML

<my-element value="2"></my-element>

试试看

var el = document.querySelector('my-element');

// add event listener

el.addEventListener('change', function (e) {
    console.log('value changed from %s to %s', e.detail.from, e.detail.to);
});

// change the value

el.value = 4; 

// this will cause the 'change' event to fire
// the listener will output this to the console:

// "value changed from 2 to 4"

因为我们已经将change event的bubbles选项设置为true ，所以我们也可以使用事件委托。

xtag.addEvent(document.body, 'change:delegate(my-element)', function (e) {
    console.log('Value of <my-element> somewhere in <body> changed');
});

内部的onchange事件是否侦听setter的元素访问器？

问题描述

2 个解决方案

解决方案1
1 2015-06-20 23:25:55

解决方案2
0 2016-03-15 21:21:24

内部的onchange事件是否侦听setter的元素访问器？

问题描述

2 个解决方案

解决方案1 1 2015-06-20 23:25:55

解决方案2 0 2016-03-15 21:21:24

解决方案1
1 2015-06-20 23:25:55

解决方案2
0 2016-03-15 21:21:24