読者です 読者をやめる 読者になる 読者になる

感謝のプログラミング 10000時間

たどり着いた結果(さき)は、感謝でした。

片方のHTMLファイルから他のHTMLファイルをjQueryで読み込んで表示させる。

jQuery
<スポンサーリンク>

jQueryを使って、一方のHTMLファイルから別のHTMLファイルの内容を読み込んで表示するサンプル

読み込む側のHTML(test1.html)は以下の通り。

<!DOCTYPE>
<html>
  <head>
  	<!--
  	<link rel="stylesheet" type="text/css" href="style.css" />
    -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
    </script>
    <script type="text/javascript">
      $(function() {
      	$.get(
      	 'test2.html',
      	 function(data) {
      		$('#expressTEST').html(data);
      	 });
      });
    </script>
  </head>
  <body>
  	<div id="expressTEST">
    </div>
  </body>
</html>

jQueryで「test2.html」を読み込んで、
id="expressTEST"のところに表示させる。
読み込まれる側のHTML(test2)はこんな感じ.。

<ul class="testList">
  <li><a href="http://yahoo.com">Google Home</a>
    <ul>
      <li><a href="hoge1">HOGE1</a></li>
      <li><a href="hoge1">HOGE1</a></li>
      <li><a href="hoge1">HOGE1</a></li>
      <li>FUGA</li>
    </ul>
  </li>
</ul>

<table id="languages" border="0" cellspacing="1">
  <thead>
    <tr>
      <th>Language</th>
      <th>Type</th>
      <th>Invented</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Java</td>
      <td>Static</td>
      <td>1995</td>
    </tr>
    <tr>
      <td>Ruby</td>
      <td>Dynamic</td>
      <td>1993</td>
    </tr>
  </tbody>
</table>

Apacheを立ち上げ、以下のURLにリクエストを投げると、test1.htmlがtest2.htmlの内容を読み込み、bodyに表示させることができる。

http://localhost/jquery/test1.html

感謝のプログラミング

今回で感謝のプログラミングは【571時間目】
10000時間まで、あと【9429時間】