繁体   English   中英

“ document.all”这一行在做什么?

[英]What is this “document.all” line doing?

我是一名Flex / Actionscript难民,正在尝试使用JS / HTML5 / CSS3。 有些事情是有道理的,但是有些事情却没有。

我正在看这个JSfiddle “纯JavaScript可拖动” ,但我不理解这一行(或者,我了解它在做什么,但不知道它是如何做的)

    x_pos = document.all ? window.event.clientX : e.pageX;

我查找了“ document.all”,它似乎是没有参数的Element.querySelectorAll()简写?

返回一个非活动的NodeList,其中包含与指定CSS选择器组匹配的,从其被调用的元素派生的所有元素。

  • 那是对的吗? 那么“全部”参数意味着它正在返回DOM中的所有内容?
  • “非活动” NodeList是什么意思? “非现场”?
  • 实际的行是...测试window.event.clientX或e.pageX是否为非null?

基本的东西,但令人困惑。


var selected = null, // Object of the element to be moved
    x_pos = 0, y_pos = 0, // Stores x & y coordinates of the mouse pointer
    x_elem = 0, y_elem = 0; // Stores top, left values (edge) of the element

// Will be called when user starts dragging an element
function _drag_init(elem) {
    // Store the object of the element which needs to be moved
    selected = elem;
    x_elem = x_pos - selected.offsetLeft;
    y_elem = y_pos - selected.offsetTop;
}

// Will be called when user dragging an element
function _move_elem(e) {
    x_pos = document.all ? window.event.clientX : e.pageX;
    y_pos = document.all ? window.event.clientY : e.pageY;
    if (selected !== null) {
        selected.style.left = (x_pos - x_elem) + 'px';
        selected.style.top = (y_pos - y_elem) + 'px';
    }
}

// Destroy the object when we are done
function _destroy() {
    selected = null;
}

// Bind the functions...
document.getElementById('draggable-element').onmousedown = function () {
    _drag_init(this);
    return false;
};

document.onmousemove = _move_elem;
document.onmouseup = _destroy;

那是对的吗? 那么“全部”参数意味着它正在返回DOM中的所有内容?

是。 页面中的每个元素都放在一维,类似数组的结构中并交给您。

“非活动” NodeList是什么意思? “非现场”?

NodeList可以是活动的,也可以是非活动的 活动的NodeList表示当相关DOM更改时数组元素也会发生变化(即:如果我从DOM中删除了<a> ,则收集所有<a>的活动NodeList会神奇地丢失一个元素)。 一种非生活是好的……一种不会改变的生活。 (即:如果我从DOM中删除了<a> ,则收集所有<a>的非活动NodeList仍将引用已删除的<a> )。

实际的行是...测试window.event.clientX或e.pageX是否为非null?

document.all可能正用于检查正在使用的浏览器 在这种情况下,它将检查要使用的事件对象,是全局事件还是本地事件。

的document.all?

正在检查该方法是否存在(在三元分配内部)


“非活动” NodeList是什么意思? “非现场”?

这意味着,如果对检索到的nodeList的项目执行操作会影响nodeList,则可以确保列表不会更改;
(典型示例是按类名选择,然后更改类名);
如果您是从getElementsByClassName获得列表的,则该列表将立即更新,从而影响该列表。


在您的示例脚本中说您从未使用过querySelectorAll(),

引用尖的评论

'document.all是旧的Microsoft IE。 从根本上来说,这是一种检测代码是否在Internet Explorer中运行的(坏)方法。”

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM