ホームページ >ウェブフロントエンド >htmlチュートリアル >セルフコンパイルされた mjfn.js フロントエンド フレームワーク description_html/css_WEB-ITnose
注: このドキュメントの所有権は、以下の Github 所有者に属します。質問も大歓迎です!
ユーザー注: セレクターはフロントエンドでのみ使用できます。このフレームワークはバックエンドで使用することはお勧めできません (node.js)。このフレームワークは jquery フレームワークを模倣していますが、jquery よりも軽量であり、継続的に更新されます。また、いくつかの共通モジュールが追加されており、フロントエンド エンジニアの作成が大幅に容易になります。まだ編集を始めたばかりですが、セレクターやいくつかの機能を追加しました。今後、機能はどんどん豊富になっていきます。自分自身の要件がある学生は、jquery よりもはるかに理解しやすいソース コードを学習することもできます (複雑さがまったく異なり、jquery をプログラミングする人は単なるマスターです!) このフレームワークはまだ IE8 には適していません。 ! ! !
remove/getClass/ele_W_H/body_W_H/click/pagination/Time、arrChan、strChan、obj、オブジェクト下のメソッド/エラースローメソッド
このフレームワークを紹介します使用されるグローバル変数は MjFn 変数の 1 つだけで、すべての操作メソッドは変数内のプロトタイプ メソッドにマウントされます。 newなしで作成されるので、使用したい場合は、3f1c4e4b6b16bbbd69b2ee476dc4f83aタグ内に次のコードを埋め込んでください:
MjFn('.className'); //example,括号内的内容是css选择器的格式
抽出された要素をフィルタリングできるようになりました:
MjFn('.className').first(); //内的第一个元素MjFn('.className').end(); //内的最后一个元素MjFn('.className').num(num); //传入的参数为这些内容内的第几个
css メソッド: スタイルで渡す、2 つの形式
MjFn('.className').css('background-color','#ABC'); //传入两个参数MjFn('.className').css({ 'background-color':'#ABC', 'border-radius':'10px', 'height':'50px', }); //传入一个json对象
removeClass / addClass / replaceClass (ノードのクラスの追加、削除、置換)
MjFn('.className').addClass('className');MjFn('.className').removeClass('className');MjFn('.className').replaceClass('className');
getClass : 要素のクラス名を取得します
MjFn('.className').getClass();
HTML タグ内のすべての子ノードをクリアできます (clear)
MjFn('.className').clear();
このノード (子ノードを含む) をクリアします
MjFn('.className').remove();
表示される高さを返します: (2 つの要素と本体に分割) 呼び出しチェーンの終わり
MjFn('.className').ele_W_H(); //元素可见的宽和高,返回一个array,arr[0]是宽,arr[1]是高MjFn('.className').body_W_H(); //页面可见的宽和高,返回一个array,arr[0]是宽,arr[1]是高
addHTML: 要素に子ノードを追加します
MjFn('.className').addHTML('<a>我是子节点</a>');
コンテンツの置換と追加 (chanText、addText)
コンテンツを追加するには、addHTML の代わりにこれを使用することを強くお勧めします。これら 2 つのメソッドは、コンテンツを追加する前に HTML コードを変換します。 HTML処理は行われず、文字列として出力されます。
MjFn('.className').chanText(str); //替换字符串MjFn('.className').addText(str); //在原有的基础上添加内容
クリックメソッド: クリックイベント
MjFn('.className').click(function(e) { //e为点击事件! expression });
時間オブジェクト: イベントを取得
MjFn().Time.DateFac(); //统一工厂方法:DateFac方法 [几年几月几号,几时几分几秒]
ページネーションメソッド: URL、このページ番号を渡す、総ページ数 (>7 ページは 7 ページを表示、
7 ページは合計を表示)MjFn('#page').pagination('URL', 5, 12); //下面附图,配合framework.css工作效果更佳!
CSS レンダリング付きフレーム
ダウンロードアドレス: https://github.com/merjiezo/mjzframework