zoukankan      html  css  js  c++  java
  • ext学习笔记一

    Ext.onReady这个方法是指当前DOM加载完毕后,保证页面内的所有元素能被Script引用

    Ext.onReady(function(){

      alert("嗯,ext第一个程序!");

    });

     通过ID获取DOM节点

    传统:var testDiv=document.getElementById("testDiv");没有任何问题,为了要让这个节点干点事情,我们还要手工编写不少代码;另外对于不同浏览器间的差异,处理起来也是个麻烦的问题。

    ext的做法

    var testDiv=Ext.get("testDiv");

    我们可以对获取到的这个对象,做各种各校的DOM节点操作,如(增加或删除 CSS类选择器,事件,定位,拖放等)

    举个例子:

      testDiv.addClass("red");//添加一个class="red"

      testDiv. center();//将元素居中

      testDiv.setOpacity(.25);//使元素半透明

    获取多个DOM的节点

    通常获取多个DOM节点,难以依靠ID的方式来获取。有可能因为没设置ID,或者是多个ID容易导致冲突,又或者直接用ID方式引用太多元素。

    这种情况下,我们不会用ID来作为获取元素的依据,可能会用属性(attribute) 或css classname代替。基于以上原因,ext引入了一个功能强大的DOM Selector库,叫做DomQuery。

    DomQuery可作为单独的库使用(DomQuery.js) 但常用于Ext,令人欣喜的是,元素对象本身就有Element.select的方法来实现,即内部调用DomQuery选取元素。

    示例:

    下面的代码中没有一个P标记是有ID的,而我们想轻松地通过一次操作马上获取每一个段落P,全体执行它们的动作,可以这样做。

    <script type="text/javascript">

     Ext.select('p').highlight();

    </script>

    <body>

     <p>p标记</p>

     <p>p标记</p>

     <p>p标记</p>

     <p>p标记</p>

     <p>p标记</p>

     <p>p标记</p> 

    </body>

     DomQuery的选取参数是一段较长的数组,其中包括W3C CSS3 Dom选择器、基本XPath,HTML属性等。。。

  • 相关阅读:
    jQuery火箭图标返回顶部代码
    jQuery火箭图标返回顶部代码
    jQuery火箭图标返回顶部代码
    jQuery火箭图标返回顶部代码
    jQuery火箭图标返回顶部代码
    正则表达式
    python链接oracle数据库以及数据库的增删改查实例
    无法删除用户的解决办法
    【爬虫】大杀器——phantomJS+selenium
    【爬虫】把抓到数据存起来——爬虫绝配mongodb
  • 原文地址:https://www.cnblogs.com/shihao/p/1689330.html
Copyright © 2011-2022 走看看