Javascript 将函数附加到 DOMWindow 对象

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10324501/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 00:52:02  来源:igfitidea点击:

Attach function to DOMWindow Object

javascript

提问by SpYk3HH

I have this nice little snippet i've made for getting browser position:

我为获取浏览器位置而制作了这个漂亮的小片段:

if (!window.position) {
    window.position = function() {
        return navigator.appName.toLowerCase().indexOf("explorer") >= 0 ? { x: window.screenLeft, y: window.screenTop } : { x: window.screenX, y: window.screenY };
    };
};

It works great, what i'm wondering is, anyone know (i can't seems to find/remember if it exist) if there is something like a "_prototype" so that I can attach the function permanently. This would be useful in the case I have something like:

它很好用,我想知道的是,任何人都知道(我似乎无法找到/记住它是否存在)是否有类似“_prototype”的东西,以便我可以永久附加该功能。如果我有以下情况,这将很有用:

var bob =   window.open(...);

So then I could say:

那么我可以说:

var bobSposisition = bob.position(); // and of course get the same thing on bob that i'm getting on my current parent window.


Updated after answered[added fun snippet!]

回答后更新[添加了有趣的片段!]



This question was old and a bit unthought, but if it helps ya, you may also be interested in the following snippet!

这个问题很老而且有点未经思考,但如果它对你有帮助,你可能也对以下片段感兴趣!

;;(function() {
    "use strict";
    /** window.position
     *  Add `position` method to windows object that allows for detection of the current browser window position.
     *
     *  @returns Object Object of x and y points of current position. Also updates window.position properties, as neccesary.
     *  
     *  @property INT window.position.originX Original X point upon page load. Never updates, unless page is reloaded.
     *  @property INT window.position.originY Original Y point upon page load. Never updates, unless page is reloaded.
     *  @property INT window.position.lastX Last X Point at time of last call to window.position() method. Only updates if current position has changed since last call.
     *  @property INT window.position.lastY Last Y Point at time of last call to window.position() method. Only updates if current position has changed since last call.
     *  @property INT window.position.x Current X Point at time of last call to window.position() method. Updates everytime window.position() method is called.
     *  @property INT window.position.y Current Y Point at time of last call to window.position() method. Updates everytime window.position() method is called.
     */
    window['position'] = function() { var position = function() { var a = 0 <= navigator.appName.toLowerCase().indexOf("explorer") ? { x: window.screenLeft, y: window.screenTop } : { x: window.screenX, y: window.screenY }; void 0 == window.position && (window.position = {}); void 0 == window.position.history && (window.position.history = []); if (void 0 == window.position.lastX || a.x != window.position.x) window.position.lastX = window.position.x; if (void 0 == window.position.lastY || a.y != window.position.y) window.position.lastY = window.position.y; window.position.x = a.x; window.position.y = a.y; window.position.history.push({ x: a.x, y: a.y, last: { x: window.position.lastX, y: window.position.lastY } }); return a; }, pos = position(); position.originX = position.x = pos.x; position.originY = position.y = pos.y; position.history = [{ x: pos.x, y: pos.y, last: { x: pos.x, y: pos.y } }]; return position; }();
})();

/*  To Add To jQuery, simply insert the following after above code and after jQuery is added to page    */

if (jQuery) {
    (function($) {
        /** jQuery(window).position()
         *
         *  @description As is, jQuery's `.position` method errors out when applied to '$(window)'.
         *  The following extends the `.position` method to account for `window` if `window.position` exist.
         *
         *  @example $(window).position();
         *      Will output an Object like:
         *      { x: 2643, y: 0, top: 0, left: 2643, lastX: 1920, lastY: 0, originX: 1920, originY: 0 }
         */
        if (window.position && $.fn.position) {
            $.fn.originalPosition = $.fn.position;
            $.fn.position = function() {
                return this && "object" == typeof this && this[0] == window ? $.extend(!0, window.position(), {
                    top: window.position.y,
                    left: window.position.x,
                    lastX: window.position.lastX,
                    lastY: window.position.lastY,
                    originX: window.position.originX,
                    originY: window.position.originY
                }) : $.fn.originalPosition.apply(this, arguments)
            }
        }
    })(jQuery);
}

jsFiddle

js小提琴

回答by jfriend00

Properties assigned to the windowobject are the same as global variables. So your code:

分配给window对象的属性与全局变量相同。所以你的代码:

if (!window.position) {
    window.position = function() {
        return navigator.appName.toLowerCase().indexOf("explorer") >= 0 ? { x: window.screenLeft, y: window.screenTop } : { x: window.screenX, y: window.screenY };
    };
};

is the same as:

是相同的:

if (typeof position == "undefined") {
    var position = function () {
        return navigator.appName.toLowerCase().indexOf("explorer") >= 0 ? { x: window.screenLeft, y: window.screenTop } : { x: window.screenX, y: window.screenY };
    };
};    

In no cases will changes to globals or the window property persist to another page, window or frame as they each have their own state from scratch.

在任何情况下,对全局变量或窗口属性的更改都不会持续到另一个页面、窗口或框架,因为它们从头开始都有自己的状态。



To deal with your issue, you could make a function that takes the desired window as an argument:

为了解决您的问题,您可以创建一个将所需窗口作为参数的函数:

function getWindowPosition(obj) {
    return navigator.appName.toLowerCase().indexOf("explorer") >= 0 ? { x: obj.screenLeft, y: obj.screenTop } : { x: obj.screenX, y: obj.screenY };
}

In the context of your new window, you could use it like this:

在新窗口的上下文中,您可以像这样使用它:

var bob = window.open(...);
var pos = getWindowPosition(bob);

This cross-window access would be subject to the same-origin security restrictions, but as long as they are the same origin, this would work.

这种跨窗口访问将受到同源安全限制,但只要它们是同源的,这将起作用。