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




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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • dedecms的各个文件代表的意思

    dedecms的各个文件代表的意思

    2022年4月3日
    52
  • 计算机基础知识汇总_计算机数学基础学什么

    计算机基础知识汇总_计算机数学基础学什么计算机数学基础第1章函数、极限与连续11函数的概念111基本初等函数112复合函数113初等函数12函数的极限121当x→∞时的极限122当x→x0时的极限13极限的四则运算法则14两个重要极限141极限limx→0sinxx=1142极限limx→∞1+1x…

    2022年8月11日
    6
  • 5分钟搞定敏感词过滤!

    5分钟搞定敏感词过滤! 函数工作流(FunctionGraph,FGS)是一项基于事件驱动的函数托管计算服务,托管函数具备以毫秒级弹性伸缩、免运维、高可靠的方式运行。通过函数工作流,开发者无需配置和管理服务器,只需关注业务逻辑,编写函数代码,以无服务器的方式构建应用,便能开发出一个弹性高可用的后端系统,并按实际运行消耗的资源计费。极大地提高了开发和运维效率,减小了运作成本。 相比于传统的架构,函数服务构建的…

    2022年4月29日
    48
  • ConcurrentHashMap源码分析(JDK8版本)

    ConcurrentHashMap源码分析(JDK8版本)注:本文源码是JDK8的版本,与之前的版本有较大差异ConcurrentHashMap是conccurrent家族中的一个类,由于它可以高效地支持并发操作,以及被广泛使用,经典的开源框架Spring的底层数据结构就是使用ConcurrentHashMap实现的。与同是线程安全的老大哥HashTable相比,它已经更胜一筹,因此它的锁更加细化.

    2022年6月24日
    30
  • Chrome performance_开发者模式玩游戏流畅

    Chrome performance_开发者模式玩游戏流畅主要有4方面:(对照下图)1.控制按钮。2.overview。页面性能的高级汇总(FPS:帧率,CPU:CPU占用,NET:网络请求)3.火焰图。CPU堆叠追踪的可视化(左侧名称是主线程的各种事件,Network:网络请求详细情况)4.数据统计。以图表的形式汇总数据(summary:统计报表,Bottom-Up:事件时长顺序,CallTree:事件调用顺序,Eventlog:事件发生的……

    2025年7月9日
    7
  • 云服务器上运行python程序(PyCharm本地编辑同步服务器+Anaconda)挂载跑实验详细教程[通俗易懂]

    云服务器上运行python程序(PyCharm本地编辑同步服务器+Anaconda)挂载跑实验详细教程[通俗易懂]云服务器上运行python程序(PyCharm本地编辑同步服务器+Anaconda)挂载跑实验教程

    2022年6月24日
    74

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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