ベストアンサー

Javascriptでこんなことが出来ますか？

2006/05/23 16:56

トップページとセカンドページの構造でホームページを作りました。セカンドページの内容をトップページに呼び出したいのですが・・・セカンドページの中身の詳細ですが、・表題・副題・文章（写真などもあります）のような構造でHTMLを作っています。トップページのテーブル内に・表題・副題・文章のみで、全体の文章から200文字まで表示するというようなものをJavascriptで出来ますか？ちょっとした修正であればいじれるくらいのレベルでお恥ずかしいのですが、宜しくお願いします。

tomo504
お礼率31% (6/19)

JavaScript
回答数3
ありがとう数8

みんなの回答 （3）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

buffalomasa
ベストアンサー率66% (70/106)

2006/05/25 20:51 回答No.2

セカンドページを ------------------------------------------------------------------ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> </head> <body> <span id="Title">ひょうだい</span> <span id="SubTitle">ふくだい</span> <span id="Contents">ぶんしょう</span> </body> </html> ------------------------------------------------------------------ とするとトップページは ------------------------------------------------------------------ <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript"> function GetXmlHttpReqObj() { if (window.ActiveXObject) { try { return new ActiveXObject("Msxml2.XMLHTTP") ; } catch (e) { try { return new ActiveXObject("Microsoft.XMLHTTP") ; } catch (e2) { return null ; } } } else if (window.XMLHttpRequest) { return new XMLHttpRequest() ; } else { return null ; } } function load() { var xmlhttp = GetXmlHttpReqObj(); if (xmlhttp == null) { return; } var element = document.getElementById("second"); xmlhttp.open("post", "second.html", true); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4) { var ResponseText = xmlhttp.responseText; var TitleStartPos = ResponseText.indexOf("<span id=\"Title\">"); var TitleEndPos = ResponseText.indexOf("</span>", TitleStartPos); var Title = ResponseText.slice(TitleStartPos, TitleEndPos) var Title = Title.substr(17); var SubTitleStartPos = ResponseText.indexOf("<span id=\"SubTitle\">", TitleEndPos); var SubTitleEndPos = ResponseText.indexOf("</span>", SubTitleStartPos); var SubTitle = ResponseText.slice(SubTitleStartPos, SubTitleEndPos) var SubTitle = SubTitle.substr(20); var ContentsStartPos = ResponseText.indexOf("<span id=\"Contents\">", SubTitleEndPos); var ContentsEndPos = ResponseText.indexOf("</span>", ContentsStartPos); var Contents = ResponseText.slice(ContentsStartPos, ContentsEndPos) var Contents = Contents.substr(20, 200); element.innerHTML = Title + "<br>" + SubTitle + "<br>" + Contents; } } xmlhttp.send(null) } </script> </head> <body onload="load()"> <div id="second"></div> </body> </html> ------------------------------------------------------------------ トップページの <div id="second"></div> の箇所にセカンドページの内容が表示されます。恐らくもっとスマートな方法もあると思いますが。

質問者

補足 2006/05/30 09:08

buffalomasaさん　ありがとうございました。こういう回答を待っていました。これを参考にさせていただきます。もし、buffalomasaさんが参考にしている本やサイトがあれば教えてください宜しくお願いします。

その他の回答 (2)

buffalomasa
ベストアンサー率66% (70/106)

2006/05/30 18:13 回答No.3

こんにちわ。 > もし、buffalomasaさんが参考にしている本やサイトがあれば教えてください宜しくお願いします。 Ajaxは基本的に新しい技術ではなく古い技術の寄せ集めみたいなものですのでわたしとしてはこの本を一番すすめます。基本を押さえておいた方がいいでしょう。 JavaScript & DHTMLクックブック（本） http://www.amazon.co.jp/gp/product/4873111692/250-3361931-7652245?v=glance&n=465392 古い技術と言ってもそれなりの作法がありますのでその辺はこの本を参考にして下さい。今はAjaxの本も何種類か出ているようですのでこの本以外でも適当なものでいいと思います。 Ajax入門（本） http://www.amazon.co.jp/gp/product/4797332646/250-3361931-7652245?v=glance&n=465392 サイトではこのあたりが情報が豊富です。 Ajaxリンク集（サイト） http://iteman.typepad.jp/blog/2005/03/ajax.html No1.さんが言ってるのは少し間違っています。これでは扱うデータはあたかもXMLのみのような感じです。どちらかと言えばAjaxで扱うデータはXML以外のデータがほとんどです。いわゆる普通のデータです。HTMLでもplaneなテキストでもいいです。AjaxがXMLも扱えると言うのが本当の解釈です。確かにAjaxの最後のxはXMLのxですが、あまり言葉を素直に受け取らない方がいいでしょう。

質問者