2020-08-02 htmlのWebStorageの利点+ CSSのポインターイベント+ LiのJS動的読み込みイベントのバインディング+フロントエンドエラーの分類とソフトスキルのキャプチャ

2020-08-02トピックのソース:http://www.h-camel.com/index.html

[html] H5のWebストレージの利点は何ですか

WebStorageは、Cookieとは異なり、H5によって提案されたWebストレージテクノロジーであり、Cookieによって引き起こされるいくつかの制限を克服し、セッション間で存在する可能性のある多数のデータメカニズムを格納します。

Cookieのアプリケーションシナリオは、ブラウザーとサーバー間のデータの保存です。Cookieのサイズ、数量、および長さは制限されており、ブラウザーに制限されています。WebStorageは情報のローカルストレージテクノロジーであり、該当するデータは、サーバーのシナリオに言及せずにクライアント側で厳密に制御する必要があります。

[css]ポインタイベントの実際の使用法を示す例を挙げてください

1.クリックして、pointer-eventを貫通します:none; //許可、つまりマウスイベントを無効にしますpointer-event:auto; //禁止

2.確認コードの取得や一定期間内に再度クリックできない設定など、繰り返されるクリックイベントを防止する 

3.pointer-event:none; //タグのページジャンプを禁止できます

4.pointer-event:none; //要素が完全に配置されている場合、その基本要素を選択できます

5.pointer-event:none; //マウスイベントのみを無効にでき、他の方法でバインドされたイベントもトリガーされます

6.要素の子要素がpointer-event:autoの場合、子要素がクリックされると、親要素のイベントがイベントバブリングの形でトリガーされます

[js]動的に読み込まれるliにイベントをバインドする方法

シナリオ:ドキュメントをロードするときにliタグが存在しないため、li loadingイベントを発行できません。イベントフローには、キャプチャ、ターゲットステージ、バブリングが含まれます。最良の方法は、親要素に子要素を見つけさせることです。liタグはバブリングフェーズ中に渡され、この時点で取得できます。

解決策:jqueryが提供するon()関数

$('.main-content').on('click', 'li', function(e) {
        alert(this);
    });

ps:$(parent class selector).on( "event"、 "subclass selector"、処理関数)

【ソフトスキル】フロントエンドエラーの分類とは?これらのエラーをキャッチしますか?

1.フロントエンドの特別なエラーhttps://blog.csdn.net/qq_25243451/article/details/78811776

2.フロントエンドのエラー処理https://segmentfault.com/a/1190000015567273

3.フロントエンドのエラーキャプチャhttps://www.cnblogs.com/cythia/p/11093231.html

おすすめ

転載: blog.csdn.net/vampire10086/article/details/108341253