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的更多相关文章

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 ...
DOJO DOM 功能
In this tutorial, you'll learn about how to use Dojo to manipulate the DOM in a simple, cross-browse ...
现代DOJO（翻译）
http://dojotoolkit.org/documentation/tutorials/1.10/modern_dojo/index.html 你可能已经不用doio一段时间了,或者你一直想保持 ...
Dojo框架学习笔记<二>
一.dojo/dom 该模块定义了Dojo Dom API,主要有以下几种用法: 1.dom.byId();(相当于document.getElementById()) ①最直接的用 ...
找出并解决 JavaScript 和 Dojo 引起的浏览器内存泄露问题
简介: 如果大量使用 JavaScript 和 Ajax 技术开发 Web 2.0 应用程序,您很有可能会遇到浏览器的内存泄漏问题.如果您有一个单页应用程序或者一个页面要处理很多 UI 操作,问题可能 ...
开始 Dojo 开发
原文出处:Joe Lennon 从头开始学习 Dojo,第 1 部分开始 Dojo 开发 Dojo Toolkit 简介 Dojo 于 2004 年创建,使开发 DHTML 和 JavaScript ...
Dojo - 操作Dom的函数
DOM Manipulation You might be seeing a trend here if you have gotten this far in the tutorial, in th ...
Dojo入门：DOM操作
作为一款功能齐全的js工具包,dojo提供了统一的DOM操作方法. dojo.byId dojo.byId 函数使您可以通过 id 属性选择一个 DOM 节点.该函数是标准 document.ge ...
dojo框架笔记
一.模块定义 1.定义只含值对,没有任何依赖的模块(moudle1.js) define({ color: "black", size: "unisize" } ...

随机推荐

iOS开发 XML解析和下拉刷新，上拉加载更多
iOS开发 XML解析和下拉刷新,上拉加载更多 1.XML格式 <?xml version="1.0" encoding="utf-8" ?> 表示 ...
stl学习之字符串
其实string也是stl里面的内容,记录几点自己不常用的内容 1.at方法(比[]会判断是否越位) 2. int copy(char *s, int n, int pos=0) const; 把当前 ...
adb shell am pm
adb shell am instrument [options] <COMPONENT> 作用:启动对instrument实例的监视. 参数[options]: -e <key&g ...
[C++程序设计]字符数组的赋值与引用
只能对字符数组的元素赋值,而不能用赋值语句对整个数组赋值. char c[5]; c={′C′,′h′,′i′,′n′,′a′}; //错误,不能对整个数组一次赋值 c[0]=′C′; c[1]=′h ...
Sad Angel (悲伤的天使)-Игорь Крутой
悲伤的天使(neyanbhbin) -经典作曲Sad Angel( Печальныйангел)生活是一种连续的影响,每个小人物都有小人物的伟大故事.从开头的情侣,到美丽的丝带,从清洁老伯到卖气球的 ...
磁盘管理二-LVM相关内容
1.基本概念 LVM:logical volume manager 逻辑卷管理器 LVM构成:物理卷PV,卷组VG(PE物理区域,最小存储单元),逻辑卷LV(LE逻辑区域,最小存储单元) 三者如下图所 ...
hdu just a hook(线段树，区间修改)
Just a Hook Time Limit: 4000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total ...
居然因为交换错了好几把。。。。，还有坑点是num1可以大于num2
完数 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submissi ...
更有效率的使用 Visual Studio - 快捷键
工欲善其事,必先利其器.虽然说Vim和Emacs是神器,但是对于使用Visual Studio的程序员来说,我们也可以通过一些快捷键和潜在的一些功能实现脱离鼠标写代码,提高工作效率,像使用Vim一样使 ...
html 标签释义
position 位置给....定位作用:定位 position:fixed 锁定游览器位置如右下角弹窗 absolute 绝对定位游览器左上角 position: ...

dojo.create\dojo.place\dojo.empty\dojo.destroy\dojo.body