問題タブ [x-tag]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
1225 参照

javascript - Web コンポーネントでタグの内部テキストを設定する方法

私はxタグを利用しています。これが私が取り組んでいるコードです。これらの div ボックスの内容を、カスタム要素の属性値の値で設定する必要があります。これを行うことは可能ですか?設定してみましたが、「undefined is not a function」というエラーが出ました。

0 投票する
2 に答える
337 参照

javascript - x-tag イベント委任: ルート要素へのアクセス

「タップ」イベントをカスタム要素の閉じるボタンにデリゲートclose()し、ルート要素でメソッドを呼び出す必要があります。次に例を示します。

0 投票する
1 に答える
147 参照

javascript - クリック/フォーカス/タブ操作のための Javascript フロントエンド テスト機能

最近、ウェブサイト全体を壊す変更をリリースしました。JavaScript のテスト機能がないことにうんざりしています。独自の xtag コンポーネントを作成し、多数の js 関数を用意しています。Jasmine のようなテスト機能で私が抱えている問題の 1 つは、フォーカス、クリック、およびタブ操作をテストしたいということです。

例:

(コメントを得る前に、私が認識しているシングルトンの xtag コンポーネントを使用することはできません。)

私がテストしたいのは、1->2->3->4 から正しくタブ移動することです。2 つのコンポーネントを手動でテストしました。一方は成功し、もう一方は失敗します。

気に入ったテスト機能をいくつか見たことがありますが、この機能をテストする機能を見つけることができませんでした。js だけではそのようなタブ操作をテストできないことはわかっています。それができる場合、どのjsテストライブラリを使用してこれを自動的にテストできますか? jsを変更するたびに手動でテストしたくありません。

0 投票する
1 に答える
1115 参照

web-component - Microsoft の X-Tag と Mozilla の X-Tag の比較

最近、Microsoftは、カスタム要素を作成するために新しいX-Tagライブラリを開始しました。ウェブサイトによると、

X-Tag は、Microsoft がサポートするオープン ソースの JavaScript ライブラリであり、W3C 標準 Web コンポーネント ファミリの API をラップして、コンポーネントを迅速に開発するためのコンパクトで機能豊富なインターフェイスを提供します。X-Tag は、すべての Web コンポーネント API (カスタム要素、Shadow DOM、テンプレート、および HTML インポート) の機能フックを提供しますが、操作にはカスタム要素のサポートのみが必要です。カスタム要素がネイティブにサポートされていない場合、X-Tag は Google の Polymer フレームワークと共有される一連のポリフィルを使用します。ビルドセクションでパッケージオプションを確認できます

私が覚えている限りでは、少し前までは、Mozillaでさえまったく同じ名前のX-Tagという同様のプロジェクトを持っていました。

これらのプロジェクトは互いにどのように異なっていますか? それとも、ブランディングを一新した同じプロジェクトですか?

0 投票する
3 に答える
394 参照

javascript - すべての html 要素を拡張する

is:"ajax-pop"x-tag を使用して、属性を配置したすべての html 要素を拡張する方法を見つけようとしています。

私がやりたいのは、 is:"ajax-pop" 属性を持つ要素をクリックすると、いくつかの動的 ajax ロードを実行することです。管理しやすいシステムを開発するための良い出発点になるでしょう。

私はいくつかの異なる方法でそれを行うことができることを知っていますが、このように拡張する方法があるのではないかと思っています:「すべてのネイティブhtml要素」

0 投票する
1 に答える
196 参照

javascript - 関数を x-tag アクセサー経由で渡す

x-tagアクセサーを使用しようとしていますが、それらに関する適切なドキュメントが見つかりません.アクセサーを介して関数を渡し、次のように書きたいと思います:

そして、その機能を保存して後で使用したいと思います。それを行う方法はありますか?

0 投票する
1 に答える
495 参照

javascript - カスタム要素を登録する必要があるのはなぜですか

ポリマーまたは x-tag を使用する場合、新しい要素を登録する必要があります。しかし、プレーンな es6 JavaScript を使用して、registerElement を使用せずに怪しげなコンポーネントを構築できるとすれば、それはなぜでしょうか。これは、ポリフィルや es5 へのトランスパイルなしで、最新バージョンの Chrome、Firefox、および Edge で正常に動作します。

この関数を使用して、コンポーネント クラス インスタンスを初期化 (マウント) します。

コンポーネント クラス:

参照: ES6 Web コンポーネント – フレームワークのない男

および要素登録:

カスタム要素を使用する前に、登録する必要があります。それ以外の場合、ブラウザーはそれを HTMLElement と見なします。意味 ?

更新- W3C 仕様は本日 2016 年 3 月 18 日に更新されました。

2.1の紹介から:

カスタム要素は、作成者が完全な機能を備えた独自の DOM 要素を構築する方法を提供します。作成者は文書内でいつでも非標準のタグ名を使用でき、アプリケーション固有の動作が事後にスクリプトなどによって追加されますが、そのような要素は歴史的に非準拠であり、あまり機能的ではありませんでした。カスタム要素を定義することにより、作成者は、要素を適切に構築する方法と、そのクラスの要素が変更にどのように反応するかをパーサーに通知できます。