作为一款功能齐全的js工具包，dojo提供了统一的DOM操作方法。

dojo.byId

dojo.byId 函数使您可以通过 id 属性选择一个 DOM 节点。该函数是标准 document.getElementById 函数的一个别名，但是显然简短易书写。

dojo.query

虽然dojo.byId可以方便的根据id来获取一个DOM节点，但是根据id获取每一个元素几乎是不可能的，因为id是唯一标识。如果一次想获取几个元素，我们可以通过dojo.query方法。

dojo.query 函数接受一个字符串参数，使用一个 CSS3 选择器引用您想选择的元素。这种操作方式很像jquery对DOM的操作。如果我们想获取页面中的某一个class的所有元素，只需要使用以下代码：

dojo.query(".class")

这个方法将返回一个NodeList，我们可以通过遍历这个list来操作每一个元素。

dojo.body

dojo.body方法返回document的body元素

dojo.create

dojo.create方法创建一个元素

dojo.destroy

dojo.destroy方法会从父元素中删除该元素，并删掉该元素的所有子元素

dojo.empty

dojo.empty方法将删除掉所有子元素

dojo.forEach

dojo.forEach方法允许为数组或NodeList定义一个迭代器，来访问数组或NodeList中的每一项，并提供相应的操作。

这个方法会忽略返回值，并且是不支持break的。

还有很多其它有用的方法，可以在http://dojotoolkit.org/api/ 查看

如果认为此文对您有帮助，别忘了支持一下哦！

声明：本博客原创文字只代表本人工作中在某一时间内总结的观点或结论，与本人所在单位没有直接利益关系。转载时请在文章页面明显位置给出原文链接。

Dojo入门：DOM操作的更多相关文章

  1. AJAX入门---DOM操作HTML

    AJAX入门---DOM操作HTML 一边学习AJAX一边坐着总结加深印象.上次写的是怎样简单的使用XMLHttpRequest对象.今天写的是DOM(文档对象模型(Document Object M ...

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

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

  3. jQuery入门基础（事件、DOM操作）

    http://www.w3school.com.cn/b.asp 一.事件 1.常规事件——把js事件前面的on去掉 比如:js:onclick——JQuery:click 下面是 jQuery 中事 ...

  4. 3、DOM操作

    一.认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面 ...

  5. js 第二篇 （DOM 操作）

    DOM 节点含有:元素节点,属性节点,文本节点. document.getElementById("id") //通过页面元素ID 值 捕获元素对象,得到的值为一个object 1 ...

  6. JQuery DOM操作（属性操作/样式操作/文档过滤）

    jQuery——入门(三)JQuery DOM操作(属性操作/样式操作/文档过滤) 一.DOM属性操作 1.属性 (1).attr() 方法 语法:$(selector).attr(name|prop ...

  7. jQuery学习之路（2）-DOM操作

    ▓▓▓▓▓▓ 大致介绍 jQuery作为JavaScript库,继承并发扬了JavaScript对DOM对象操作的特性,使开发人员能方便的操作DOM对象. ▓▓▓▓▓▓ jQuery中的DOM操作 看 ...

  8. 从DOM操作看Vue&React的前端组件化，顺带补齐React的demo

    前言 接上文:谈谈我对前端组件化中“组件”的理解,顺带写个Vue与React的demo 上次写完博客后,有朋友反应第一内容有点深,看着迷迷糊糊:第二是感觉没什么使用场景,太过业务化,还不如直接写Vue ...

  9. 摆脱DOM操作，从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  10. 前端页面卡顿？或是DOM操作惹的祸，需优化代码

    文档对象模型(DOM)是一个独立 于特定语言的应用程序接口.在浏览器中,DOM接口是以JavaScript语言实现的,通过JavaScript来操作浏览器页面中的元素,这使得 DOM成为了JavaSc ...

随机推荐

  1. 【LuoguP5383】[模板]普通多项式转下降幂多项式

    传送门 Sol (怎么老是有人喜欢出新的多项式毒瘤板子,懒得整到一起了) 核心就是把 幂用下降幂来代替. 使用斯特林数展开幂为下降幂: \[x^n=\sum_{i=0}^n{x\choose i}i! ...

  2. Acwing-91-最短Hamilton路径(状压DP)

    链接: https://www.acwing.com/problem/content/93/ 题意: 给定一张 n 个点的带权无向图,点从 0~n-1 标号,求起点 0 到终点 n-1 的最短Hami ...

  3. spring容器BeanFactory简单例子

    在Spring中,那些组成你应用程序的主体及由Spring Ioc容器所管理的对象,都被称之为bean.简单来讲,bean就是Spring容器的初始化.配置及管理的对象.除此之外,bean就与应用程序 ...

  4. head first 设计模式笔记9-迭代器模式

    迭代器模式:提供一种方法顺序访问一个集合对象中的各个元素,而又不暴露其内部的表示. 迭代器接口 /** * @author oy * @date 2019年9月22日 上午9:03:08 * @ver ...

  5. jquery disabled选择器 语法

    jquery disabled选择器 语法 作用:disabled 选择器选取所有禁用的表单元素.大理石平台价格表 语法:$(":disabled") jquery disable ...

  6. C# socket异步 服务端

    转自:  http://blog.csdn.net/qq_20282263/article/details/54310737 private Dictionary<string, Session ...

  7. Word：表格前添加新行 + 删除表格后的空行

    本文适用于Word 2007 + Windows 7,造冰箱的大熊猫@cnblogs 2018/8/3 近日新学(百度到)两条新Word操作,记录下来以备查询 1.在表格前添加新行 场景:有没有遇到过 ...

  8. dp周训练 状态压缩

    题目链接:题意:给你一个10*10的矩阵,每到一个格子中都要拿一个0-9的数值,求从矩阵左上方走到右下方且必须0-9都经过,拿的数值和最小是多少: #include <iostream> ...

  9. mystrcat

    #include<stdio.h> //如果一个数组做为函数的形参传递,那么数组可以在被调用的函数中修改 //有时候不希望这个事发生,所以对形参采用const参数 //size_t str ...

  10. Spring Boot教程（二十七）整合Spring Security

    在这一节,我们将对/hello页面进行权限控制,必须是授权用户才能访问.当没有权限的用户访问后,跳转到登录页面. 添加依赖 在pom.xml中添加如下配置,引入对Spring Security的依赖. ...