ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryで行を追加する方法

jqueryで行を追加する方法

藏色散人
藏色散人オリジナル
2021-11-17 11:51:253731ブラウズ

jquery で

の行を追加する方法: 1. 新しい HTML ファイルを作成します; 2. table タグを使用してテーブルを作成します; 3. addonetr() 関数を作成します; 4. table through "id(testtb)" Object; 5. append() メソッドを使用して、テーブルに行を追加します。

jqueryで行<tr>を追加する方法

この記事の動作環境:Windows7系、jquery3 .バージョン 2.1、DELL G3 コンピューター

jquery

の行を追加する方法?

jquery は tr の行を動的に追加します。指定されたテーブル:

test.html という名前の新しい HTML ファイルを作成して、jquery が指定されたテーブルに tr の行を動的に追加する方法を説明します。

jqueryで行<tr>を追加する方法

test.html ファイル内で、table タグ、tr タグ、td タグを使用して 2 行 2 列のテーブルを作成します。テーブルへの列。

jqueryで行<tr>を追加する方法

test.html ファイルで、テーブル タグの ID を testtd に設定します。これは主に、以下のこの ID を通じてテーブル オブジェクトを取得するために使用されます。

jqueryで行<tr>を追加する方法

test.html ファイルで、button タグを使用して、「tr の行を追加」というボタン名を持つボタンを作成します。

jqueryで行<tr>を追加する方法

test.html ファイルで、onclick イベントをボタンにバインドします。ボタンがクリックされると、addonetr() 関数が実行されます。

jqueryで行<tr>を追加する方法

js タグで addonetr() 関数を作成し、その関数内で変数 html を定義して、追加する必要があるテーブル行を保存します。 id (testtb) を通じてテーブル オブジェクトを取得し、append() メソッドを使用してテーブルに行を追加します。

jqueryで行<tr>を追加する方法

test.html ファイルをブラウザで開き、ボタンをクリックして効果を確認します。

jqueryで行<tr>を追加する方法

推奨学習: 「

jquery ビデオ チュートリアル

以上がjqueryで行を追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。