airoot uisysは、仮想DOMを使用せずにモジュール化とデータバインディングを簡単に実装できるWebフロントエンドモジュラーツールです。開発経験と運用効率の点で元の経験に近く、優れたWeb開発支援です。
それで、今日は、uisys（略語）がjavascriptを使用してhtml（dom）の下の要素を取得する方法を見てみましょう。それを読んだ後は、とてもシンプルで失礼なことに驚かれると思います。
1.具体的な方法
airoot uisys v1バージョンには、jsを介して要素をdomの下に取得する4つの方法があります。
方法1IDで取得
たとえば、domにidtxtのテキストボックスとidlbのspanタグがあります。これを取得する方法は次のとおりです
（この方法では、スクリプト内の同じ変数名をdom要素で定義できない必要があります。なぜですか？Web開発を研究したことがある人なら誰でも知っています。 ）
<div>
<input id="txt" value="Hello!" />
<span id="lb">Hello Span!</span>
</div>
<script>
func init(){
alert(txt.value);
alert(lb.innerHTML);
}
</script>
方法2通過する＃
たとえば、domにidtxtのテキストボックスとidlbのspanタグがあります。取得方法は次のとおりです
（このメソッドはdocument.getElementByIdメソッドと同等であるため、jsの名前が同じであることを説明しても問題ありません。）
<div>
<input id="txt" value="Hello!" />
<span id="lb">Hello Span!</span>
</div>
<script>
func init(){
alert(#txt.value);
alert(#lb.innerHTML);
}
</script>
メソッド3document.getElementByIdを取得する
たとえば、domにidtxtのテキストボックスとidlbのspanタグがあります。取得方法は次のとおりです
（この方法はより原始的ですが、ID名の前に$を付ける必要があります。これは、モジュールの下の要素IDを取得することを意味します。$が追加されていない場合これは、ブラウザグローバルでIDを取得することを意味します。覚えておいてください。）
<div>
<input id="txt" value="Hello!" />
<span id="lb">Hello Span!</span>
</div>
<script>
func init(){
alert(document.getElementById("$txt").value);
alert(document.getElementById("$lb").innerHTML);
}
</script>
方法4domキーワードを使用する
domはuisysのキーワードであり、このモジュールの下のhtmlのルートノードを表します。
つまり、htmlにノードが1つしかない場合、domキーワードはこのノードを指します。例は次のとおりです。
<div>
Hello AIroot UISYS ~
</div>
<script>
func init(){
alert(dom.innerHTML);
}
</script>
2つ、より複雑な取得
domキーワードを使用して、次のコードなどのより複雑なクエリを実行できます。
<div>
<input id="txt" name="ipt" value="Hello!" />
<span id="lb">Hello Span!</span>
<h1>01</h1>
<h1>02</h1>
<h1>03</h1>
<div class="Menu">
<div class="MenuItem">Menu Item 1</div>
<div class="MenuItem">Menu Item 2</div>
<div class="MenuItem">Menu Item 3</div>
<div class="MenuItem">Menu Item 4</div>
<div class="MenuItem">Menu Item 5</div>
</div>
</div>
<script>
func init(){
console.log(document.getElementById("$txt").value);
console.log(document.getElementById("$lb").innerHTML);
var tags = dom.getElementsByTagName("h1");
for(let k in tags){
console.log(tags[k]);
}
var clss = dom.getElementsByClassName("MenuItem");
for(let k in clss ){
console.log(clss [k]);
}
console.log(dom.getElementsByName("ipt"));
}
</script>
3、まとめ
全体的な取得方法は上記のとおりです。示されているuisys取得方法は、基本的にネイティブjavascript取得方法と同じです。実際、理解しやすいのですが、uisysはWebのDockerですか？そのコードは分離されているだけなので、ビルドされたbomの最下層であるため、取得方法は元の方法と同じです。
uisysはBomの基盤となるapiに基づいて構築されているため、仮想DOMフレームワークよりも高速に実行され、より多くのリソースを消費します。
もっと知りたい場合は、私に従ってください、私は定期的に更新します