Ext.dom.Element 常用方法解析

Ext.Element,Ext.core.Elemen,Ext.dom.Element 这几个类都是一个类,在EXT当中给起了别名而已,这个类到作用主要是针对DOM元素操作的封装,使我们操作针对DOM操作更加方便了,而且底层屏蔽了浏览器到差异。
 
那么如何返回一个Ext.Element对象呢?通过Ext.get(el)就可以了。
参数 el : String/HTMLElement/Ext.Element(The id of the node, a DOM Node or an existing Element.)
// by id
var el = Ext.get("my-div"); // by DOM element reference
var el = Ext.get(myDivElement);

像上面这样就返回了一个Ext.Element对象,然后我们就可以使用它的API来简化我们的开发了,下面介绍几个常用的功能。

1. 给元素添加事件:el.on( eventName, fn, [scope], [options] ) 。

el.on('click', this.onClick, this, {
single: true,
delay: 100,
stopEvent : true,
forumId: 4
});

eventName:事件的名称 例如: click,dbclkc,mouseover等等。

fu: 事件的处理函数。

scope(可选):事件处理函数中this的指向,如果不指定默认为Element对象本身。

options(可选): 处理函数到配置信息,这个参数里到内容比较多,下面一一介绍。

scope: 事件处理函数中this的指向,如果不指定默认为Element对象本身。

delegate:执行el子孙元素中的某一个元素影响事件,此处可以是一个选择器表达式(Ext.core.DomQuery)

stopEvent: (preventDefault stopPropagatio)同时生效

preventDefault :取消默认动作(比如给A标签添加了click事件,那么点击A标签以后 首先会响应click事件,然后浏览器不会跳转【正常会href的】)
stopPropagatio: 取消传播(这个不知道干啥的)
normalized :如果设置为false 那么事件处理函数的第一个参数就是浏览器到 EVENT对象,否则是Ext.EventObject

target:这个属性目前也不知道干啥的

delay:事件延迟多少毫秒

single :事件只执行一次

buffer :事件在多少毫秒之内只执行一次,比如设置为2000 那么在2秒内只能触发一次事件

2. getViewSize( ) 获取元素的宽高

var vpSize = Ext.getBody().getViewSize();

// all Windows created afterwards will have a default value of 90% height and 95% width
Ext.Window.override({
width: vpSize.width * 0.9,
height: vpSize.height * 0.95
});

Ext.dom.Element 常用方法解析的更多相关文章

  1. ExtJS学习之路第二步:Ext.Component 和 Ext.dom.Element 的区别

    让我们来初步的探讨下Ext.Component和Ext.Element的区别. jQuery偏重于DOM元素的操作 1.每一个HTML页面都有一个层次分明的DOM树模型,浏览器中的所有内容都有相应的D ...

  2. java: (正则表达式,XML文档,DOM和DOM4J解析方法)

    常见的XML解析技术: 1.DOM(基于XML树结构,比较耗资源,适用于多次访问XML): 2.SAX(基于事件,消耗资源小,适用于数量较大的XML): 3.JDOM(比DOM更快,JDOM仅使用具体 ...

  3. JavaScript : DOM文档解析详解

    JavaScript DOM  文档解析 1.节点(node):来源于网络理论,代表网络中的一个连接点.网络是由节点构成的集合 <p title=“a gentle reminder”> ...

  4. JAXP进行DOM和SAX解析

    1.常用XML的解析方式:DOM和SAX 1)DOM思想:将整个XML加载内存中,形成文档对象,所以对XML操作都对内存中文档对象进行. 2)SAX思想:一边解析,一边处理,一边释放内存资源---不允 ...

  5. python XML文件解析:用xml.dom.minidom来解析xml文件

    python解析XML常见的有三种方法: 一是xml.dom.*模块,是W3C DOM API的实现,若需要处理DOM API则该模块很合适, 二是xml.sax.*模块,它是SAX API的实现,这 ...

  6. THML DOM / Element 对象操作

    随着Vue等MVVM框架流行,操作DOM已经不想之前那么频繁,因此很多DOM的操作已经陌生,特此回顾HTML中DOM操作 获取Element节点 熟悉的有 通过ID获取,返回element对象    ...

  7. Dom,pull,Sax解析XML

    本篇随笔将详细讲解如何在Android当中解析服务器端传过来的XML数据,这里将会介绍解析xml数据格式的三种方式,分别是DOM.SAX以及PULL. 一.DOM解析XML 我们首先来看看DOM(Do ...

  8. Android SAX、DOM、Pull解析xml文件剖析与案例讲解

    XML介绍 XML(Extensible Markup Language) 即可扩展标记语言,与HTML一样,都是SGML(Standard Generalized Markup Language,标 ...

  9. java基础71 XML解析中的【DOM和SAX解析工具】相关知识点(网页知识)

    本文知识点(目录):本文下面的“实例及附录”全是DOM解析的相关内容 1.xml解析的含义    2.XML的解析方式    3.xml的解析工具    4.XML的解析原理    5.实例    6 ...

随机推荐

  1. php管理nginx虚拟主机shell脚本

    使用php作为shell脚本是一件很方便的事情.理所当然,我们可以使用php脚本来管理 nginx虚拟主机,下面是笔者的 脚本 文件供各位参考 代码如下 复制代码 #!/usr/bin/php -q& ...

  2. 两种方法实现js页面隔几秒后跳转,及区别

    这里需要用到window的两个对象方法,setInterval()和setTimeout() 一. 区别: 1.  setInterval(code,millisec)  周期性(millisec单位 ...

  3. spring 下载

    Spring官网(https://spring.io/)改版后,直接下载Jar包的链接,下面汇总 1.直接输入地址,改相应版本即可:http://repo.springsource.org/libs- ...

  4. docker-compose教程(安装,使用, 快速入门)

    1.Compose介绍Docker Compose是一个用来定义和运行复杂应用的Docker工具.一个使用Docker容器的应用,通常由多个容器组成.使用Docker Compose不再需要使用she ...

  5. IOS 视频流

    https://github.com/kolyvan/kxmovie   demo 项目

  6. [CTCI] 双栈排序

    双栈排序 题目描述 请编写一个程序,按升序对栈进行排序(即最大元素位于栈顶),要求最多只能使用一个额外的栈存放临时数据,但不得将元素复制到别的数据结构中. 给定一个int[] numbers(C++中 ...

  7. Golang之字符串格式化

    字符串格式化 // Go 之 字符串格式化 // // Copyright (c) 2015 - Batu // package main import ( "fmt" ) typ ...

  8. linux怎么关闭iptables linux如何关闭防火墙

    Linux系统下面自带了防火墙iptables,iptables可以设置很多安全规则.但是如果配置错误很容易导致各种网络问题,那么如果要关闭禁用防火墙怎么操作呢,咗嚛本经验以centos系统为例演示如 ...

  9. 【Fiddler】Fiddler抓包

    简述 在调试H5页面.APP的网络请求时,常用Fiddler进行抓包,查看网络报文是否如我们设想.当然,Fiddler也可对我们电脑端发出HTTP请求进行抓包. Fiddler是以代理的形式运行的,即 ...

  10. cxf、struts、spring中web.xml过滤url问题解决方案

    利用struts2自带的正则匹配,应该说这算是最官方的解决方案了 在struts.properties中加正则匹配 struts.action.excludePattern=/webservice/. ...