JS および jQuery_javascript スキルを使用してテーブル内のすべてのセルの内容を走査する方法-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

JS および jQuery_javascript スキルを使用してテーブル内のすべてのセルの内容を走査する方法

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:27 PM

jquery js table 細胞トラバース

この記事の例では、JS と jQuery を使用してテーブル内のすべてのセルの内容を走査する方法について説明します。参考のために皆さんと共有してください。詳細は次のとおりです:

JS を使用して、テーブル 内のすべてのセルの内容を走査します。これを実現するには、次の JS コードを使用できます。

function GetInfoFromTable(tableid) {
 var tableInfo = "";
 var tableObj = document.getElementById(tableid);
 for (var i = 0; i < tableObj.rows.length; i++) { //遍历Table的所有Row
  for (var j = 0; j < tableObj.rows[i].cells.length; j++) { //遍历Row中的每一列
   tableInfo += tableObj.rows[i].cells[j].innerText; //获取Table中单元格的内容
   tableInfo += " ";
  }
  tableInfo += "\n";
 }
 return tableInfo;
}

ログイン後にコピー

このメソッドのパラメータは、テーブルを一意に識別する ID であり、ドキュメントオブジェクトを使用して取得できます

jQuery はテーブルの tr の td の内容を走査します:

1. $("#trID td").text() は trID の td の値を取得し、文字列を返します。

2. $("#trID").children は trID の下のすべての tds を取得し、$("#trID").children を走査し、.eq(index).text() を使用して td の値を取得します。 ;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<htmlxmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<metahttp-equiv="Content-Type"content="text/html; charset=gb2312"/> 
<title>无标题文档</title> 
<scriptlanguage="javascript"src="jquery-1.6.2.min.js"type="text/javascript"></script> 
<scriptlanguage="javascript"> 
$(document).ready(function() { 
  $("#table a").each(function (){ 
  this.onclick = function(){ 
   var thisObj = this.parentNode.parentNode; 
   var a = $(thisObj).children(); 
   var arr = new Array(); 
   var laber = $("#xiugai label"); 
   for(var i=0;i<a.length;i++){ 
    arr[arr.length] = a.eq(i).text(); 
   } 
   for(var i=0;i<laber.length;i++){ 
    laber.eq(i).text(arr[i]); 
   } 
   $("#table").hide(); 
   $("#xiugai").show(2000) 
  } 
 }); 
}); 
function fanhui(){ 
 $("#table").show(2000); 
 $("#xiugai").hide(2000);  
} 
</script> 
</head> 
<body> 
<divid ="table"> 
<tablewidth="470"border="0"cellspacing="0"cellpadding="0"> 
 <trid="tr1"> 
 <td>id</td> 
 <td>名字</td> 
 <td>密码</td> 
 <td>操作</td> 
 </tr> 
 <trid="tr2"> 
 <td>1</td> 
 <td>张三</td> 
 <td>12</td> 
 <td><ahref="#">删除</a></td> 
 </tr> 
 <trid="tr3"> 
 <td>2</td> 
 <td>李四</td> 
 <td>34</td> 
 <td><ahref="#">删除</a></td> 
 </tr> 
 <trid="tr4"> 
 <td>3</td> 
 <td>王五</td> 
 <td>56</td> 
 <td><ahref="#">删除</a></td> 
 </tr> 
 <trid="tr5"> 
 <td>4</td> 
 <td>六子</td> 
 <td>78</td> 
 <td><ahref="#">删除</a></td> 
 </tr> 
</table> 
</div> 
<divid ="xiugai"style="display:none; background-color:#FFC; height:360px; width:260px"> 
 ID：<label></label><br/> 
 姓名:<label></label><br/> 
 密码:<label></label><br/> 
 <buttononclick="fanhui()">返回</button> 
</div> 
</body> 
</html>

ログイン後にコピー

この記事が JavaScript プログラミングのすべての人に役立つことを願っています。

このウェブサイトの声明

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

ホットAIツール

ホットツール

ホットトピック

Gmailメールのログイン入り口はどこですか？

7523

CakePHP チュートリアル

1378

Steamのアカウント名の形式は何ですか

Win11 Activation Key Permanent

NYTの接続はヒントと回答です

Related knowledge

Excel が先頭のゼロを削除しないようにする方法 Feb 29, 2024 am 10:00 AM

Excel ブックから先頭のゼロを自動的に削除するのはイライラしますか?セルに数値を入力すると、Excel では数値の前の先頭のゼロが削除されることがよくあります。デフォルトでは、明示的な書式設定が欠如しているセルエントリは数値として処理されます。一般に、先頭のゼロは数値形式では無関係であるとみなされ、省略されます。さらに、先行ゼロは特定の数値演算で問題を引き起こす可能性があります。したがって、ゼロは自動的に削除されます。この記事では、口座番号、郵便番号、電話番号などの入力された数値データが正しい形式であることを確認するために、Excel で先頭のゼロを保持する方法を説明します。 Excel で、数値の前にゼロを付けるにはどうすればよいですか? Excel ブック内の数値の先頭のゼロを保持できます。いくつかの方法から選択できます。セルを設定するには、

推奨: 優れた JS オープンソースの顔検出および認識プロジェクト Apr 03, 2024 am 11:55 AM

顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネットアプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワークインタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザーエクスペリエンスが向上することが挙げられます。欠点としては、モデルサイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピュータービジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。

WPS は 1 つのセルを 2 つに分割します Mar 20, 2024 pm 06:00 PM

WPS ソフトウェアは、テキストやドキュメントの処理に不可欠なヘルパーです。実際のアプリケーションでは、テキストやドキュメントを処理するためにセル内で操作する必要があることがよくあります。セルに関する知識は豊富です。今回はWPSでセルを2つに分割する具体的な手順を紹介します。 1. まず、編集する必要がある WPS テーブルを開き、2 つのセルに分割する必要があるセルドキュメントを選択します。 2. データ内の「列」をクリックして開きます。 3. ポップアップウィンドウで「固定幅」を選択し、「次へ」をクリックします。 4. ポップアップウィンドウで、列を分割する場所をクリックし、Enter キーを押して確定します。 1 つの例から推測してください。3 に変更する必要がある場合は、数値も 3 に変更できます。 5. 次に、[完了] をクリックします。 6. 別の方法もあります

Java フォルダーをループしてすべてのファイル名を取得する方法 Mar 29, 2024 pm 01:24 PM

Java は、強力なファイル処理機能を備えた人気のあるプログラミング言語です。 Java では、フォルダーを走査してすべてのファイル名を取得するのが一般的な操作であり、これは特定のディレクトリー内のファイルを迅速に見つけて処理するのに役立ちます。この記事では、Java でフォルダーを走査してすべてのファイル名を取得するメソッドを実装する方法と、具体的なコード例を紹介します。 1. 再帰的メソッドを使用してフォルダーを走査する再帰的メソッドを使用してフォルダーを走査することができます。再帰的メソッドはそれ自体を呼び出す方法であり、フォルダーを効果的に走査できます。

jQueryでPUTリクエストメソッドを使用するにはどうすればよいですか? Feb 28, 2024 pm 03:12 PM

jQueryでPUTリクエストメソッドを使用するにはどうすればよいですか? jQuery で PUT リクエストを送信する方法は、他のタイプのリクエストを送信する方法と似ていますが、いくつかの詳細とパラメータ設定に注意する必要があります。 PUT リクエストは通常、データベース内のデータの更新やサーバー上のファイルの更新など、リソースを更新するために使用されます。以下は、jQuery の PUT リクエストメソッドを使用した具体的なコード例です。まず、jQuery ライブラリファイルが含まれていることを確認してから、$.ajax({u

jQueryで要素の高さ属性を削除するにはどうすればよいですか? Feb 28, 2024 am 08:39 AM

jQueryで要素の高さ属性を削除するにはどうすればよいですか?フロントエンド開発では、要素の高さ属性を操作する必要が生じることがよくあります。要素の高さを動的に変更する必要がある場合や、要素の高さ属性を削除する必要がある場合があります。この記事では、jQuery を使用して要素の高さ属性を削除する方法と、具体的なコード例を紹介します。 jQuery を使用して高さ属性を操作する前に、まず CSS の高さ属性を理解する必要があります。 height 属性は要素の高さを設定するために使用されます

jQuery のヒント: ページ上のすべての a タグのテキストをすばやく変更する Feb 28, 2024 pm 09:06 PM

タイトル: jQuery ヒント: ページ上のすべての a タグのテキストをすばやく変更する Web 開発では、ページ上の要素を変更したり操作したりする必要がよくあります。 jQuery を使用する場合、ページ内のすべての a タグのテキストコンテンツを一度に変更する必要がある場合があります。これにより、時間と労力を節約できます。以下では、jQuery を使用してページ上のすべての a タグのテキストをすばやく変更する方法と、具体的なコード例を紹介します。まず、jQuery ライブラリファイルを導入し、次のコードがページに導入されていることを確認する必要があります: &lt

jsとvueの関係 Mar 11, 2024 pm 05:21 PM

js と vue の関係: 1. Web 開発の基礎としての JS、2. フロントエンドフレームワークとしての Vue.js の台頭、3. JS と Vue の補完関係、4. JS と Vue の実用化ビュー。

See all articles

JS および jQuery_javascript スキルを使用してテーブル内のすべてのセルの内容を走査する方法

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック