dojo 学习笔记之dojo.query - query(id) 与query(class)的区别

考虑这个例子:动态创建一个页面的时候,用new listtem()生成多个listitem, 且每个listitem中都生成一个按钮button。

如果想要给每个按钮都绑定一个click事件,用dojo.query来获取这些button是比较方便的。

这样做的时候我遇到一个问题, 在create这些button的循环语句中我给每个button 定义了id = "somebtn" 。

然后试图用var btnlist = dojo.query("#somebtn") 得到一个包含页面中所有button的数组。

遗憾的是,query 语句并没能获取到所有button, 它只获取到1个button对象, 从 console.log(btnlist.length) 语句的输入结果是1可以判断。

重新查看http://dojotoolkit.org/reference-guide/1.9/dojo/query.html documentation 中的说明,发现文中用的例子基本都是query(".someClass"),只用了class,
并没有用id。

于是回忆起以前看过的关于class与id的区别提到过id是唯一标识,也就意味着页面中的id只能代表唯一一个元素, 那么就可以想得通为什么query(id)只能获取到1个元素。

给button添加了class属性后, 再用query("class")就可以获取到所有button对象了。

遇到问题的时候,先通过调试大致判断问题出在哪里,确认问题后再查文档,对症下药。 这是今天的小结。

dojo 学习笔记之dojo.query - query(id) 与query(class)的区别

时间: 2024-08-17 10:44:07

dojo 学习笔记之dojo.query - query(id) 与query(class)的区别的相关文章

dojo 学习笔记之dojo.query - query(id) 与query(class)的差别

考虑这个样例:动态创建一个页面的时候,用new listtem()生成多个listitem, 且每一个listitem中都生成一个按钮button. 假设想要给每一个按钮都绑定一个click事件,用dojo.query来获取这些button是比較方便的. 这样做的时候我遇到一个问题, 在create这些button的循环语句中我给每一个button 定义了id = "somebtn" . 然后试图用var btnlist = dojo.query("#somebtn"

Dojo 学习笔记 之 Dojo hitch&partial

原文: http://dojotoolkit.org/documentation/tutorials/1.10/hitch/index.html 版本: Dojo 1.10 为了更好地使用JavaScript原生函数,dojo/_base/lang模块提供了很多非常有用的方法.这里,我们来学习JavaScript函数(Function)对象基础,及如何使用lang.hitch来绑定函数的上下文.在此基础上,学习如何使用lang.partial来绑定函数的特定参数,及如何使用lang.hitch实

dojo 学习笔记之一 dom.byId dojo.byId registry.byId 的区别

在dojo中,除了沿用Dom结点, dojo 还自定义了一类结点用"dojoType" 进行标识. dojo 称这些结点为widget. 当检测到HTMl文档中某个标签定义了dojoType 属性之后,dojo会调用dojo包中相应的 js 及 css 文件对这个结点进行渲染. 从而这个结点元素就会相应地显示出具有dojo特色的样式及功能. 如此说来, dom.byId 跟 dojo.byId 获取到的就是普通的HTMl文档结构树中的某个结点元素,以下简称dom结点, 而 regist

树莓派学习笔记——Model B Model B+ Compute Module Dev Kit的区别和联系

0 前言 最近浏览器树莓派官方发现树莓派推出了两款新Model--一款名为树莓派 model B+,一款名为树莓派 Compute Module Dev Kit.带着欣喜和恐惧查阅了相关资料,并通过淘宝和RS中国了解开发板价格.欣喜的感觉来自于树莓派的功能得到了增强,恐惧来自于树莓派的改变带来新的学习成本.经过几天的资料收集,所以整理成博文和大家分享. 1 横向比较 [共性比较] 表1 三款树莓派横向比较 区别 Model B Model B+ Compute Module Dev Kit 芯片

Dojo学习笔记(十三):Dojo表单控件——TextBox及其变体

dijit/form/TextBox :一个基本的文本框 dijit/form/SimpleTextarea :大量文字输入,一个基本的textarea dijit/form/Textarea :一个扩展dijit/form/SimpleTextarea动态增加或减少其高度 dijit/form/NumberTextBox或dijit/form/NumberSpinner:输入是数字,确保输入一个文本框,dijit/form/NumberSpinner提供扩展dijit/form/NumberT

Dojo学习笔记(二十一):创建自定义Dojo小部件

在这个教程中,我们将会演示如何利用Dojo 和Dijit框架来创建自定义的小部件,主要会使用到dijit/_WidgetBase and dijit/_TemplatedMixin. Dojo的Dijit 库包含了丰富的界面小部件(Widgets),通过使用这些小部件,可以打造出强大的Web应用界面,从高级的表单元素,到复杂页面布局. 假设我们需要开发一个能展示所有Dojo教程作者的简介信息的页面,我们手头的数据源是如下的JSON数据: [     {         "name": 

Elasticsearch学习笔记(二)Search API 与 Query DSL

一. Search API eg: GET /mall/product/_search?q=name:productName&sort=price desc 特点:search的请求参数都是以HTTP请求的的query stirng 附带的 适用范围:适用于临时的在命令行使用一些工具,比如curl,快速的发出请求,来检索想要的信息: 适用于简单的查询条件 二.Query DSL 将Query DSL视为ASL查询则有两种类型的查询语句: 叶子查询语句(Leaf Query clause) : 叶

Dojo学习笔记(十五):应用程序部件

1.dijit/Tooltip 提示条(Tooltip)是为页面上的空间提供辅助信息的常用手段,其样式定义在单独的样式文件中,开发人员可以自己修改.同时也提供了一些强大的功能,比如可以显示图片.图表和从服务器请求得到的数据等,可以控制显示的时间和出现持续的时间. dijit/Tooltip 的属性 属性 属性类别 描述 connectId String 要挂载 Tooltip 的控件的 Id,可以为用逗号分隔的多个 Id  label String 要显示的提示信息 showDelay Inte

Dojo学习笔记(十):Dojo布局——堆叠容器

可以把小部件层叠在一起,而一次只显示一个屏面. 1 dijit.layout.AccordionContainer AccordionContainer 顾名思义是像手风琴一样可以收缩的面板,这种方式比较适合单个portal的布局,小巧易用:也可以用于整个页面的布局. AccordionContainer申明方式样例: <!DOCTYPE HTML> <html> <head>     <meta charset="UTF-8">