2016年3月11日 星期五

dojo/dom

dojo/dom

簡介

dojo/dom 是 dojo 在操作 DOM Tree 時，最基本的模組。可供呼叫的函式不多，只有三個：

byId(name)
依據傳入參數的字串，找到屬性 id="name" 的節點，這個函式用到的機會很高，畢竟要針對某一個節點運作時，總得先尋找並鎖定該節點。但在 dojo 中很有意思的是，在許多需要傳入節點做為參數的地方，可以直接傳入作為 id 名稱的字串， dojo 的函式會自行判斷，如果是傳入的是節點，則開始運作，如果傳入的是字串，則先自行呼叫 dom.byId() 函式，在取得節點後再行運算。所以有時候，也完全可以不去用這個函式。
isDescendant(node, ancestor)
用來測試 node 是否為 ancestor 的子節點，node 不限制一定要是 ancestor 的直接子節點，即使是好幾代之後的子節點，傳回值也是 true，若不是任何一代的子節點，則傳回 false 。
setSelectable(node, boolean)
若 boolean 值為 true，設定 node 節點為可選取，若 boolean 值為 false，則設定 node 節點為不可選取。

範例

CSS

<style>
html {
    width:100%;
    height:100%;
}
body {
    margin: 0 auto;
    width:1000px;
    height:100%;
    padding-top:20px;
}
.box {
    width:300px;
    height:200px;
    padding:10px;
    border: 2px solid black;
}
</style>

CSS 中用 .box{} 設定方塊的外觀屬性。

HTML

<body class="claro">


    
    
        
  • One
    • 
        
  • Two
    • 
        
  • Three
    • 
        
  • Four
    • 
    



</body>

Html 中建立一個方塊，在方塊中包含一個無序數的清單。

Script

第 12 行和第 13 行的執行結果是一樣的，兩種寫法都可以，就看各人喜好了。

第 15 行將整份文件都設定為不可選取；因此第 16 行的設定也沒有效果了。

張貼者： 於
標籤：

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)