dojo英文_dojo教程

dojo英文_dojo教程首先是引用:require(["dojo/dom-construct"],function(domConstruct){});dom-construct主要包含如下方法:1.toDom()require(["dojo/dom-construct","dojo/dom","dojo/on","dojo/domReady!"],function(domConstruct,dom…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

首先是引用:

require(["dojo/dom-construct"], function(domConstruct){ 
   
    
});

dom-construct主要包含如下方法:

1.toDom()

require(["dojo/dom-construct", "dojo/dom", "dojo/on", "dojo/domReady!"],
function(domConstruct, dom, on){
   
   
  on(dom.byId("button1"), "click", function(){
   
   
    var row = domConstruct.toDom("<tr><td>bar</td><td>Bar is also good</td></tr>");
    domConstruct.place(row, "example");
  });
});

Here is our HTML <table> which we will add the row to.

<button id="button1" type="button">Add a row</button>
<table>
  <thead>
    <tr><th>Example</th><th>Description</th></tr>
  </thead>
  <tbody id="example">
    <tr><td>foo</td><td>Foo is good</td></tr>
  </tbody>
</table>

2.place()

require(["dojo/dom-construct", "dojo/dom", "dojo/on", "dojo/domReady!"],
function(domConstruct, dom, on){
   
   
  var n = 0;
  on(dom.byId("placeBA"), "click", function(){
   
   
    domConstruct.place("<div class='node'>new node #" + (++n) + "</div>", "refBA",
      dom.byId("posBA").value); // before/after
  });
});
<p>
  <button id="placeBA">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: 1st</div>
  <div>after: 2nd</div>
</p>
div.ref     {
   
    background-color: #fcc; }
div.node    {
   
    background-color: #cfc; }
div.child   {
   
    background-color: #ffc; }
div.ref div {
   
    margin-left: 3em; }

3.create()

Append a new <div> to<body> with no attributes:

require(["dojo/dom-construct", "dojo/_base/window"], function(domConstruct, win){
   
   
  var n = domConstruct.create("div", null, win.body());
});

Place a new <div> as the first child of<body> with no attributes:

require(["dojo/dom-construct", "dojo/_base/window"], function(domConstruct, win){
   
   
  var n = domConstruct.create("div", null, win.body(), "first");
});

4.empty()

require(["dojo/dom-construct"], function(domConstruct){
   
   
  // Empty node's children byId:
  domConstruct.empty("someId");
});

5destory()

require(["dojo/dom-construct", "dojo/dom", "dojo/on", "dojo/domReady!"],
function(domConstruct, dom, on){
   
   
  on(dom.byId("progButtonNode"), "click", function(){
   
   
    domConstruct.destroy("testnode1");
    dom.byId("result1").innerHTML = "TestNode1 has been destroyed.";
  });
});

Some DomNodes

<div id="testnode1">TestNode 1</div>
<button id="progButtonNode" type="button">Destroy TestNode1</button>
<div id="result1"></div>

具体应用看官网例子:http://dojotoolkit.org/reference-guide/1.10/dojo/dom-construct.html




版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/194707.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号