blog

お楽しみに!エメット流JQだ!

JQの使い方を模倣し、dom、event、cssなどの基本的なapiを提供します。興味があれば、後で拡張を続けることができます。 大きなコンテナにはラップされた各要素が格納され、QElementはQE...

Sep 23, 2020 · 2 min. read
シェア

紹介

ドムの知識を集約するために、エメット版JQを書くことは何もありません

  • ドキュメントに基づく.querySelectorAllパッケージJQ
  • domを作成するためのEmmet構文に似ています。
  • ts

Emmet

以下の演算子がサポートされています。

  • #: id
  • : class
  • +
  • >サブ
  • [attribute=value with ;属性の値を分割します。
  • {}
<!-- #:id - div#id -->
<div id="id"></div>
<!-- .:class - div.class -->
<div class="class"></div>
<!-- []:属性 attr - 入力.class1.class2#id[style=color:red;font-size:30px,value=value] -->
<input class="class1 class2" id="id" style="color:red;font-size:30px" value="value">
<!-- {}:テキスト - div{text} -->
<div>text</div>

Emmetの不具合バージョン。現在のところ、*10のような記述は受け付けません。

構造

JQの使用を模倣し、基本的なドム、イベント、CSSや他のAPIを提供します。背面に興味がある拡大し続けることができます。

QElements

大きなコンテナはラップされた各要素を包んでおり、QElementはQElementをトラバースしてQElementを生成するために使用されます。

QElement

自身のエレメントに対する特定の操作を提供します。

ドーム

npm i -S qelements

Read next