Dojo初探之3:dojo的DOM操作、query操作和domConstruct元

除了引入HttpModule模块,还要引入 JsonpModule 模块

前言:

美洲杯赌球,前面两章讲了dojo的基本规范和配置,当然这个配置不是必须的,当你有这需求的时候就可以用到dojo的config配置。

dojo的所有js都是符合AMD规范进行异步加载的:http://blog.csdn.net/eguid_1/article/details/52083016

并且详细阐述了dojo的config设置:http://blog.csdn.net/eguid_1/article/details/52092016

import { HttpModule, JsonpModule } from '@angular/http';

缀述:

这章开始真正讲解dojo的所有基本操作,包含dom、query、event(鼠标/键盘事件)、request(请求)、动画、反射(dojo实现JS的aop)等等操作。

 

本章内容简介

本章主要讲解dojo的dom操作、query操作和domConstruct元素位置操作

Observable对象要进行的操作需要引入组件,如:map操作

基于dojo的DOM操作

dojo的dom操作分为query操作和dom操作和domConstruct元素位置操作三种

import 'rxjs/add/operator/map';

1、dom操作

注:前面已经讲过了dojo是基于AMD规范的,所有引入JS的操作都是通过require异步加载来完成。

 

(1)引入dom模块

需要require一下dojo的dom模块,dojo的这个dom就是一个符合AMD规范的JS直接对象

var dom = require("dojo/dom");

(2)dom操作

 注:引入dojo的domReady!模块可以让该方法在页面加载完成后再运行。

require(["dojo/domReady!"], function() {
//设置标签内容
    function setText(node, text) {
        node = dom.byId(node);
        node.innerHTML = text;
    }
//找到id是one的标签
    var one = dom.byId("one");
    setText(one, "One has been set");
    setText("two", "Two has been set as well");

});

(3)页面

 <head>
    <title>domTest</title>
    <meta charset="utf-8">
    <script src="dojo/dojo.js">
    </script>
    <script src="js/view/domTest.js"></script>
</head>
<body>
    <ul id="list">
        <li id="one">One</li>
        <li id="two">Two</li>
        <li id="three">Three</li>
        <li id="four">Four</li>
        <li id="five">Five</li>
    </ul></body>

2、query操作

query模块可以通过标签的名字或者id或者class进行查找,与jquery中的的$()用法比较像

再使用query之前需要先引入query模块

本文由美洲杯赌球发布于计算机教程,转载请注明出处:Dojo初探之3:dojo的DOM操作、query操作和domConstruct元

TAG标签: 美洲杯赌球
Ctrl+D 将本页面保存为书签,全面了解最新资讯,方便快捷。