当前位置:必发365电子游戏 > 编程 > 必发365电子游戏固然用来落实和事件有关的功效的函数,W3C已规定一文山会海用来稳固节点的分子
必发365电子游戏固然用来落实和事件有关的功效的函数,W3C已规定一文山会海用来稳固节点的分子
2019-12-19

节点定位便是获取一个成分所在之处。
jQuery大壮节点定位有关的函数为:
$.prototype.offset
$.prototype.position

 所谓的事件机制,正是用来贯彻和事件有关的成效的函数,日常大家操作事件需3个职能:
绑定
撤除绑定
执行

在DOM编制程序中,W3C已规定意气风发类别用来定位节点的积极分子:
offsetLeft offsetTop scrollTop scrollLeft getBoundingRect getClientRects
而是那几个属性被浏览器搞得无可奈何直接用。

比如
elem.on('click', fn);

节点定位看似轻便,完结含相当多的才能。在 jQuery 中,特意定义多少个类用来治本定位(内部采纳)。

具备js框架都提供事件函数,因为:
浏览器自带的平地风波不包容。

说起岗位,我们肯能体会精通便是因素的(x, y卡塔尔 。然后职业不那么轻便:
若果左上角为(0, 0卡塔尔 地点, 那个因素之处是它的 相对地点 。
但只要页面能够滚动,在滚下之后,它的任务怎么表示? 这里自个儿把这些职位叫节点的 当前岗位。在 CSS 中, 使用 left top 能更正节点地方,但那么些岗位不是绝对坐标的点,而是相对父节点的职分。大家把那几个职位称 偏移地点。

现阶段常用的平地风波达成存:
[Ext] elem.on elem.un elem.fireEvent (addEventListener 等简写)
[jQuery]必发365电子游戏, elem.bind elem.unbind elem.trigger
[mootools] elem.addEvent elem.removeEvent elem.fireEvent

见图

本人动用的是:
elem.on  elem.un  elem.trigger - 因为最短

在 jQuery中, position 重回 偏移地点。 offset 重返当前岗位。

(PS,使用 triggerListener 是谬误的, 应该 dispatchListener)

上边三个个化解,怎样得到那个任务。

jQuery中,将事件名作为函数方便使用。

  1. 滚动位置。(滚动条翻转的轻重)
    全浏览器都平等:
    elem.srcollTop

  2. 脚下职责。
    应用  getBoundingRect 获取,但老浏览器供给手动总括那几个值。

  3. 纯属地点。
    在现阶段岗位加上轮转地点,即相对地方。

  4. 偏移地方。
    近期节点的断然位置减偏移节点的相对地方。

事件之中如何贯彻?
也正是说当大家实践 on('click', fn卡塔尔; 做什么样事?

(具体完成可以看到 jQuery 源码)

最简易也是不可使用的主意是mootools的做法:
对两样的浏览器, IE 使用 attchEvent , 别的使用 addEventListenr

那样以为是正确,但有2个难题:
当事件有几百个后,功效非常的低。(不分布)
当 on('click', fA) , on('click', fB)
这个时候假诺click, IE先运营 fB 然后 fA  其余则正常地运作 fA和fB 。(轻便变成难题)

要说好的事件机制,当是jQuery的落到实处。(但功能稍低)
第生机勃勃,jQuery内部有世界缓存数组。那些数组可用 $(卡塔尔.data('event'卡塔尔再次回到。这么些数据结构为:
event = {
 click: [fA, fB]
 dblclick: [fC]
};

当浏览器触发 click 后,遍历 event['click'] 全体函数和实行。

本身最后选取以下方式贯彻。

基本和jQuery的如出大器晚成辙, 但event数据布局为:

event = {
  click: fn_click,  // 系统click 后执行 fn_click , fn_click 履行里面包车型客车保有函数。
 ...
}

fn_click = {
   handlers: [fA, fB]
   target: elem
}

下一场是 事件指标的包裹。
所谓的事件指标,正是绑定函数的参数 e 。
(谙习 .net 的校友肯能更欣赏叫它 伊芙ntArgs  )

因为分化浏览器那么些目的不相同,所以封装是不得不承认的。
日前整个框架都选拔自定义事件目标的法子,把原事件的各值拷到自定义的对象。
但如此有久治不愈的病魔,便是非常多值只怕用不到,无故总结浪费功能,(事件是常实践的,那功用不可小视)

必发365电子游戏固然用来落实和事件有关的功效的函数,W3C已规定一文山会海用来稳固节点的分子。Ext则使用函数格局,减小没用的正片。如获得显示屏坐标,使用
e.getX(卡塔尔(英语:State of Qatar)  那有一点点欠美观。但将就了。

本人透过一再的思谋,决定不自定义事件目的。直接用自带的,
如此有个毛病: 火狐下不恐怕设置系统 getter 属性。
也正是说:
e.target = e.target.nodeType == 3 ? e.target.parentNode : e.target;  // 标准浏览器肯能 target 是文本节点。 IE的 target则是 元素。
在火狐是错的。 因为 target是只读的。

接下去是人云亦云事件触发,

在 jQuery 中,很麻烦的用代码模拟了支撑冒泡的风云。 即便在IE有周详的 fire伊夫nt ,标准浏览器也会有 dispatchListener 函数。

不过只要协调模仿,能够幸免浏览器差别,达成统生机勃勃。

上一篇:没有了
下一篇:没有了