要使用query,就要引入dojo/query包。
query可以根据Dom里节点的标签名、id名、class名来检索一个或多个节点。
--------------------------------------------------------------------------------------------

<ul
id="list">
    <li
class="odd">
        <div
class="bold">
            <a
class="odd">Odd</a>
        </div>
    </li>
    <li
class="even">
        <div
class="italic">
            <a
class="even">Even</a>
        </div>
    </li>
    <li
class="odd">
        <a
class="odd">Odd</a>
    </li>
    <li
class="even">
        <div
class="bold">
            <a
class="even">Even</a>
        </div>
    </li>
    <li
class="odd">
        <div
class="italic">
            <a
class="odd">Odd</a>
        </div>
    </li>
    <li
class="even">
        <a
class="even">Even</a>
    </li>
</ul>
 
<ul
id="list2">
    <li
class="odd">Odd</li>
</ul>
--------------------------------------------------------
var
uls = query("ul");//检索到两个ul节点

var list =
query("#list")[0];//检索到一个id为list的节点

var odds =
query(".odd");//检索到七个class为odd的节点

var oddLI =
query("li.odd");//检索到四个li的class为odd的节点
var allA = query("li
a");//检索到六个li子节点为a的节点
var someA = query("li >
a");//检索到两个li第一个子节点为a的节点
query方法中的字符串叫选择器,其规则同CSS相同,返回值为一个数组。

forEach方法用来遍历数据元素。
query(".odd").forEach(function(node,
index, nodelist){

            //
        });

在forEach的callBack方法里有三个参数,
node指代当前元素,
index指代当前元素在数组中的序列号,
nodelist为query(".odd")返回的数据(可选),在某些情况下可能需要,如需要获取当前元素前一个元素时
虽然通过id只会检索到一个节点,但query只以数组的形式返回,所以通过query("#list")[0]即可直接获取。

如果需要对检索的全部元素做相同的处理,则不用通过forEach分别对每个元素进行操作,可直接对query(".odd")进行操作,如
query(".odd").addClass("red");//对所有class名为odd的元素添加class
red

query(".odd").removeClass("red").addClass("blue");//对所有class名为odd的元素删除class
red并添加class blue

query(".even").style("color",
"white").addClass("italic
");//对所有class名为even的元素修改color样式为white,并添加class
italic

query(".hookUp").on("click",
function(){

            alert("This button is hooked
up!"
);
        });//对所有class名为hookUp的元素添加一个click响应事件

dojo 六 使用query dojo/query的更多相关文章

  1. Dojo初探之3:dojo的DOM操作、query操作和domConstruct元素位置操作(基于dojo1.11.2版本)

    前言: 前面两章讲了dojo的基本规范和配置,当然这个配置不是必须的,当你有这需求的时候就可以用到dojo的config配置. dojo的所有js都是符合AMD规范进行异步加载的:http://blo ...

  2. Dojo初探之5:dojo的request(请求)操作、请求过程事件绑定和隐藏数据data()操作(基于dojo1.11.2版本)

    前言: 上一章详细阐述了dojo的事件绑定操作,本章将讲解dojo的请求操作 注:dojo的请求操作与js和jquery完全不同! 1.dojo的请求 dojo通过request.get()/.put ...

  3. Dojo初探之4:dojo的event(鼠标/键盘)事件绑定操作(基于dojo1.11.2版本)

    前言: 上一章详解了dojo的dom/query操作,本章基于dom/query基础上进行事件绑定操作 dojo的事件 dojo的事件绑定操作分为鼠标和键盘两种进行详解 1.鼠标事件 我们沿用上一章中 ...

  4. Configuring Dojo with dojoConfig - The Dojo Toolkit

    转载自Dojo官网 Configuring Dojo with dojoConfig The dojoConfig object (formerly djConfig) allows you to s ...

  5. Dojo 学习笔记 之 Dojo hitch&partial

    原文: http://dojotoolkit.org/documentation/tutorials/1.10/hitch/index.html 版本: Dojo 1.10 为了更好地使用JavaSc ...

  6. dojo 九 effects dojo/_base/fx 和 dojo/fx

    官方教程:Dojo Effects这里讲学习一下dojo如何实现淡入.淡出.滑动等效果.实现这些特殊的效果有两个包 dojo/_base/fx 和 dojo/fx.dojo/_base/fx 中提供了 ...

  7. Hibernate中的query.setFirstResult(),query.setMaxResults();

    一.query.scroll()和query.setFirstResult(),query.setMaxResults();这两种方法都可以取到一定范围内的数据,用来数据分页显示.那么两者区别,以及两 ...

  8. dojo/Deferred类和dojo/promise类的使用

    参考博客:https://blog.csdn.net/blog_szhao/article/details/50220181        https://dojotoolkit.org/docume ...

  9. Dojo的ready函数:dojo.ready(以前的dojo.addOnLoad)

    dojo的dojo/domReady!插件和dojo/ready的区别:     In simple cases,dojo/domReady! should be used. If an app us ...

  10. Elasticsearch由浅入深(九)搜索引擎:query DSL、filter与query、query搜索实战

    search api的基本语法 语法概要: GET /_search {} GET /index1,index2/type1,type2/_search {} GET /_search { , } h ...

随机推荐

  1. 在mac下使用brew和brew cask轻松实现软件安装

    Brew(homebrew) 1.简介 Brew 是 Mac 下面的包管理工具,通过 Github 托管适合 Mac 的编译配置以及 Patch,可以方便的安装开发工具. Mac 自带ruby 所以安 ...

  2. IIS和MVC

    现象:MVC项目部署到IIS(7.5)后,浏览时只显示文件目录,不是网站 解决办法 1.服务器安装程序对应的Framework版本 2.服务器安装程序对应的MVC版本 3.安装CGI和ISAPI扩展: ...

  3. 【CentOS】cp显示进度条

    问题描述: 使用CentOS的cp时,对于大文件的拷贝或者mv,需要等待很长时间,现在需要显示cp或mv的进度 问题解决: Advanced copy 参考官网:http://beatex.org/w ...

  4. poj 1985 Cow Marathon 树的直径

    题目链接:http://poj.org/problem?id=1985 After hearing about the epidemic of obesity in the USA, Farmer J ...

  5. 【BZOJ】【2049】【SDOI2008】洞穴勘测 Cave

    LCT 哦……LCT的一道更水的裸题,适合学习access,link,cut等基本操作(其实这三个不是在一个层面上的?不要在意这些细节……) /**************************** ...

  6. 一个perfect 的解决 阴影拉伸的方法 shadow map strech

    因为在场景中做了,有的物体产生阴影比如人物,有的物体不产生阴影比如地面,这样在地面凹下去的地方,悬崖,池塘边,就会有阴影的拉伸. 实际上, 没办法上传图片.... L是光源 A 点(人物身上)产生阴影 ...

  7. unset之讲解

    unset (PHP 4, PHP 5) unset — 释放给定的变量 说明¶ void unset ( mixed $var [, mixed $... ] ) unset() 销毁指定的变量. ...

  8. Sqli-labs less 39

    Less-39 和less-38的区别在于sql语句的不一样:SELECT * FROM users WHERE id=$id LIMIT 0,1 也就是数字型注入,我们可以构造以下的payload: ...

  9. ubuntu 点点滴滴

    pptpd http://linux.cn/article-3376-1.html 命令行升级ubuntu版本 do-release-upgrade -d  寻找最新的稳定版本,加上-d参数则包括不稳 ...

  10. HDU5052 Yaoge’s maximum profit(LCT)

    典型的LCT操作,但是维护的是一个序列最左边减最右边的最小值,所以要维护左边减右边的最小值del[0]和一个右边减左边的最小值del[1](因为rev标记swap的时候对应的值也要交换).维护的时候d ...