参考

Question

我有一个接受元素作为参数的函数，该元素将用于在函数内执行操作。

function center(element) {
   // code to align this given element to center position
   element.css("position","fixed");
   element.css("top", Math.max(0, ((window.innerHeight - element[0].offsetHeight) / 2))+ "px");
   element.css("left", Math.max(0, ((window.innerWidth - element[0].offsetWidth) / 2))+ "px");
   return element;
}

// calling above function
center(element);

这里元素作为参数传递。但我不想这样做。是否可以创建一个将在元素上调用的函数？实施例

element.center();

您还可以考虑jQuery函数，例如：$(element).next();等。

注意我不想使用jQuery。我需要纯粹的javascript编码。

通过使用jQuery，可以通过创建下面的

来实现

中心功能

jQuery.fn.center = function () {
   this.css("position","absolute");
   this.css("top", Math.max(0, (($(window).height() - this.height()) / 2)   + $(window).scrollTop())+ "px");
   this.css("left", Math.max(0, (($(window).width() - this.width()) / 2) + $(window).scrollLeft())+ "px");
   return this;
};

Answer 1

您可以将功能添加到prototype对象的Node：

Node.prototype.center = function() {
    // code to align this given element to center position
    this.css("position","fixed");
    this.css("top", Math.max(0, ((window.innerHeight - element[0].offsetHeight) / 2))+ "px");
    this.css("left", Math.max(0, ((window.innerWidth - element[0].offsetWidth) / 2))+ "px");
    return this;
}

这样您就可以在任何节点上调用.center()。

注意：在定义原型函数时，this是调用函数的对象（在本例中为Node）。

Answer 2

通过向center对象添加名为element的原型，您可以在center上调用element方法。

参考

Javascript中的原型：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype

如何在HTML元素上创建函数而不是将元素作为参数传递

2 个答案:

参考