Question

我创建了一个自定义对象，并为其添加了一个名为changeColor的方法，该方法具有一个属性。我的想法是当我将此方法附加到任何DOM元素时，所有内容颜色的元素都必须更改。

这是我开始的代码：

function CustomColor() {

}

CustomColor.prototype.changeColor = function(color){
   //here what I have to specify.

}

这是非常基本的，但我是JavaScript的新手。感谢。

Answer 1

像这样使用CustomColor：

function CustomColor(element) {
    this.element = element;
}
CustomColor.prototype.changeColor = function (color) {
    this.element.style.color = color;
}

CustomColor的新实例：

var element = new CustomColor(document.body);
element.changeColor('red');

你也可以扩展实际的dom元素而不使用任何额外的类：

Element.prototype.changeColor = function (color) {
    this.style.color = color;
};

并像这样使用它：

document.body.changeColor('red')

Answer 2

我想这就是你正在照顾的事情：

var elem = document.getElementById('some_element'),
    CustomColor = function (element) {
        this.htmlElement = element;
    };
CustomColor.prototype.changeColor = function (color) {
    this.htmlElement.style.color = color;
    return;
};
elem.customColor = new CustomColor(elem);

使用附属物：

elem.customColor.changeColor('#00f');

获取对托管HTML元素的引用的唯一方法是将其作为参数传递给构造函数。但是，在changeColor中，您不能引用CustomColor的任何“私有”变量（包括其参数），因此您需要为要使用的所有属性创建“public”属性在changeColor。有关详情，请访问MDN

jsFiddle的现场演示。

上面的代码仅为特定的HTML元素创建自定义属性。建议不要为DOM元素的prototype创建自定义属性，因为并非所有浏览器都支持这些属性。

JavaScript自定义方法

2 个答案: