1、dojo.create

1.create a node; 2.set attributes on it;  3.place it in the DOM.

dojo.create(/*String|DOMNode*/ tag,    //要创建的节点(“div”、“a”、“script”)或者已存在的节点

/*Object?*/ attrs,   //节点属性对象

/*String|DOMNode*?/refNode,  //参考节点,默认为doc

/*String?*/pos    //放置位置,默认“last”,可取:before,after,replace,only,first,last...

);

http://dojotoolkit.org/reference-guide/1.7/dojo/create.html

http://dojotoolkit.org/reference-guide/1.10/dojo/dom-construct.html

 <head>
<script src="dojo-release-1.5.4-src/dojo/dojo.js"></script>
<title></title>
</head>
<body id="body">
<div id="div1">
<button id="btn"> OK</button>
<div>before:1st</div>
<div>before:2nd</div>
<div id="refNumber" class="ref">
</div>
<div>after:lst</div>
<div>after:2nd</div>
</div>
</body> <script type="text/javascript">
dojo.ready(function () {
dojo.connect(dojo.byId("btn"), "onclick", this, function creatediv() {
dojo.create("div", { innerHTML: "<p> I am New DIV</p>" }, "div1");
dojo.create("div", { innerHTML: "<a href=\"http://www.baidu.com\"> bai du yi xia</a>", style: { color: "red", border: "2px solid red" } }, "body", "last"); //创建ul
var ul = dojo.create("ul", null, "div1", "first");
var items = ["one", "two", "three", "four"];
dojo.forEach(items, function (data) {
dojo.create("li", {innerHTML:data},ul);
});
});
});
</script>
</html>

 2、dojo.place

dojo.place(/*String|DOMNode*/ node,   //1、如果是“</>”,则会创建一个HTML块;2、否则是一个id或DomNode。

/*String|DOMNode*/refNode,  //1、一个id或DomNode。

/*Number|String?*/pos    //1、如果是number表示替换refNode的第N(0、1、2...)个子节点。

2、String可以为:before、after、replace、only、first、last,默认为last。

)                                       3、“only”表示替换参照节点的所有子节点;“replace”会替换参照节点

// 返回值 returns the node it placed。

http://dojotoolkit.org/reference-guide/1.7/dojo/place.html

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="dojo-release-1.5.4-src/dojo/dojo.js"></script>
<title></title>
</head>
<body id="body">
<div id="div1" style="border:1px solid red ;width:100px;height: 200px">
<ul id="ul1">
<li id="li1">li1</li>
<li id="li2">li2</li>
<li id="li3">li3</li>
<li id="li4">li4</li>
</ul>
</div>
</body> <script type="text/javascript">
window.onload = function () {
var divs = "<div><p>fdsfds</p><a href=\"http://www.baidu.com\">百度一下</a></div>";
var ret = dojo.place(divs, "div1", "last"); //创建一个html块,并将其插入到id为【div1】的【最后】 dojo.place("li1", "li3", "before"); //把id为【li1】的节点放置在id为【li3】的节点【前面】 dojo.place(dojo.byId("ul1"), "div1", "last"); //把id为【ul1】的节点放置在id为【div1】的节点集【最后】 dojo.place(divs, "div1", "only"); //"only"表示替换所有子节点
}
</script>
</html>
<html xmlns="http://www.w3.org/1999/xhtml"> //before、 after
<head>
<script src="dojo-release-1.5.4-src/dojo/dojo.js"></script>
<title></title>
<style type="text/css">
div.ref
{
background-color:#fcc;
}
div.node
{
background-color:#cfc;
}
div.child
{
background-color:#ffc;
}
div.ref div
{
margin-left:3em;
}
</style>
</head>
<body id="body">
<p>
<button id="palceBA"> place node</button>
<select id="posBA">
<option value="before">before</option>
<option value="after">after</option>
</select>
</p>
<p>
<div>before:1st</div>
<div>before:2nd</div>
<div id="refBA" class="ref">
<div class="child">the reference node's child #0</div>
<div class="child">the reference node's child #1</div>
<div class="child">the reference node's child #2</div>
</div>
<div>after:lst</div>
<div>after:2nd</div>
</p>
</body> <script type="text/javascript">
dojo.ready(function () {
var n = 0;
dojo.connect(dojo.byId("palceBA"), "onclick", function () {
dojo.place("<div class='node'>new node#"+(++n)+"</div>","refBA",dojo.byId("posBA").value);
});
});
</script>
</html>
 <html xmlns="http://www.w3.org/1999/xhtml">   //replace
<head>
<script src="dojo-release-1.5.4-src/dojo/dojo.js"></script>
<title></title>
<style type="text/css">
div.ref
{
background-color:#fcc;
}
div.node
{
background-color:#cfc;
}
div.child
{
background-color:#ffc;
}
div.ref div
{
margin-left:3em;
}
</style>
</head>
<body id="body">
<p>
<button id="placeReplace"> place node</button>
</p>
<p>
<div>before:1st</div>
<div>before:2nd</div>
<div id="refBA" class="ref">
<div class="child">the reference node's child #0</div>
<div class="child">the reference node's child #1</div>
<div class="child">the reference node's child #2</div>
</div>
<div>after:lst</div>
<div>after:2nd</div>
</p>
</body> <script type="text/javascript">
dojo.ready(function () {
var n = 0;
dojo.connect(dojo.byId("placeReplace"), "onclick", function () {
dojo.place("<div class='node'>new node#" + (++n) + "</div>", "refBA", "replace");
dojo.attr("placeReplace","disabled","disabled"); //set
});
});
</script>
</html>

3、dojo.empty

dojo.empty(/*String|DomNode*/node)  //id或DomNode,deletes all children but keeps the node there.

//不返回任何值

4、dojo.destroy

dojo.destroy(/*String|DomNode*/node) //id或DomNode,deletes all children and the node itself.

//不返回任何值

5、dojo.body

dojo.body()  //Returns the body element of the document.

相当于:var body = document.getElementsByTagName("body")[0];

 
 
 

dojo.create\dojo.place\dojo.empty\dojo.destroy\dojo.body的更多相关文章

  1. create a large size empty file to measure transfer speed

    OS : Windows open cmd fsutil file createnew file_name 1073741824 // 1GB fsutil file createnew file_n ...

  2. DOJO DOM 功能

    In this tutorial, you'll learn about how to use Dojo to manipulate the DOM in a simple, cross-browse ...

  3. 现代DOJO(翻译)

    http://dojotoolkit.org/documentation/tutorials/1.10/modern_dojo/index.html 你可能已经不用doio一段时间了,或者你一直想保持 ...

  4. Dojo框架学习笔记<二>

    一.dojo/dom    该模块定义了Dojo Dom API,主要有以下几种用法:    1.dom.byId();(相当于document.getElementById())    ①最直接的用 ...

  5. 找出并解决 JavaScript 和 Dojo 引起的浏览器内存泄露问题

    简介: 如果大量使用 JavaScript 和 Ajax 技术开发 Web 2.0 应用程序,您很有可能会遇到浏览器的内存泄漏问题.如果您有一个单页应用程序或者一个页面要处理很多 UI 操作,问题可能 ...

  6. 开始 Dojo 开发

    原文出处:Joe Lennon 从头开始学习 Dojo,第 1 部分 开始 Dojo 开发 Dojo Toolkit 简介 Dojo 于 2004 年创建,使开发 DHTML 和 JavaScript ...

  7. Dojo - 操作Dom的函数

    DOM Manipulation You might be seeing a trend here if you have gotten this far in the tutorial, in th ...

  8. Dojo入门:DOM操作

      作为一款功能齐全的js工具包,dojo提供了统一的DOM操作方法. dojo.byId dojo.byId 函数使您可以通过 id 属性选择一个 DOM 节点.该函数是标准 document.ge ...

  9. dojo框架笔记

    一.模块定义 1.定义只含值对,没有任何依赖的模块(moudle1.js) define({ color: "black", size: "unisize" } ...

随机推荐

  1. 常用的方法,读取XML节点并赋值给List集合

    一.前言 很多时候也可以直接在XML文件中配置好节点,在程序需要用到的时候,修改XML文件并不需要重新编译,这里是在极光推送中拿出来的一部分代码.代码简单,大家直接看例子吧. 二.实现过程 1.新创建 ...

  2. Android 6.0 闪光灯的使用

    Android6.0 已经抛弃了Camer 相关的API,改用新的API接口CamerManager,下面给出使用的简单实例 package com.inper.duqiang.slashlight; ...

  3. shell中的expr命令

    expr 可以进行的操作如下: 逻辑操作 arg1 | arg2 逻辑或操作,真则返回arg1,否则返回arg2(以null或者0来判断参数的真假,有短路功能) arg1 & arg2 逻辑与 ...

  4. tomact虚拟目录,虚拟主机,http请求头,相应头

    tomact虚拟目录,虚拟主机,http请求头,相应头 07. 五 / J2EE / 没有评论   一.服务器,容器(软件)1.服务器:提供网络访问的程序2.容器:支持什么技术的服务器就叫做什么容器. ...

  5. 让PHP程序永远在后台运行

    PHP里有个函数很有用.这是在最近的开发中才逐渐用到的. int ignore_user_abort ( [bool setting] ) 这个函数的作用是指示服务器端在远程客户端关闭连接后是否继续执 ...

  6. C++----练习--string输入输出

    1.要使用标准库中的string 类型.也要增加头文件 #include<string> 2.例子: #include<iostream> #include<string ...

  7. C语言IO操作总结

    C语言IO操作总结C程序将输入看做字节流,流的来源是文件.输入设备.或者另一程序的输入:C程序将输出也看做字节流:流的目的是文件.视频显示等: 文件处理:1 :fopen("filename ...

  8. 优盘文件系统(FOR C)

    优盘上的数据按照其不同的特点和作用大致可分为5 部分:MBR 区.DBR 区.FAT 区.FDT区和DATA 区. 主引导记录(MBR) 绝对扇区号为:MBR_LBA=0x00000000 处是主引导 ...

  9. C语言的本质(32)——C语言与汇编之C语言内联汇编

    用C写程序比直接用汇编写程序更简洁,可读性更好,但效率可能不如汇编程序,因为C程序毕竟要经由编译器生成汇编代码,尽管现代编译器的优化已经做得很好了,但还是不如手写的汇编代码.另外,有些平台相关的指令必 ...

  10. View not attached to window manager crash 的解决办法

    View not attached to window manager crash 的解决办法 转自:http://stackoverflow.com/questions/22924825/view- ...