■皆さん、こんにちは。いつも回答頂きありがとうございます。

質問

■皆さん、こんにちは。いつも回答頂きありがとうございます。

　例えば、以下のYAHOO! AUCTIONのホームページでそのソースhtmlを所定のフォルダに保存します。

http://page7.auctions.yahoo.co.jp/jp/auction/g91317349

表示メニュー>ソース>
　例えば、秀丸エディタ、エディタが、開きソースを表示することができます。
　ファイルメニュー>名前を付けて保存
　で、自分の指定するフォルダに保存します。

　保存したソースを出してダブルクリックするとホームページが、開きます。

(●Q01)　しかし、インターネットから、開いた内容とソースから開いた内容では、表示内容が異なります。両者を同じにしたいのですがどのようにすれば良いでしょうか?

　違う表示の箇所は、

この商品をへ投稿(外部サイト)(アイコン)(Twitterとは)

　と表示される部分です。
　ソースから表示される内容は、上記のアイコンの部分が表示されないのと表示が無いのでリンクもできないことです。

ソースでは、

<script type="text/javascript">
<!--
var str =
'<div id="twitter_area">'+
'この商品をTwitterへ投稿（外部サイト）'+
'<div id="twitter_rt"></div>'+
'（<a href="http://topic.auctions.yahoo.co.jp/staffblog/planner/twitter/">Twitterとは</a>）'+
'</div>';
document.write(str)
//-->
</script>
</div>

と記載された部分です。

　Javascriptに関する記述で、strは、変数名で、変数名を定義して
document.write(str)
　で、書き込みをしているのでしょう。

　しかし、アイコンに相当するリンクアドレスがどこにあるのか見当たりません。

　自分のホームページでも、同様のtwitterのリンクをしたいと解析している途中です。書き込みの内容にホームページアドレスの書き込みが無くても構わないと思っています。

(●Q02)どのようにすれば良いでしょうか?

　たとえ、一つだけでも、お知りのことが有りましたら、
　　よろしく教授方お願いします。 敬具

回答No.2

yyr446 · ベストアンサー

ちなみに、ご提示のページをFireBugの動的なソース表示で見ると、
該当部分は、

<div id="twitter_area">この商品をTwitterへ投稿（外部サイト）<div id="twitter_rt"><a title="このURLをTwitterでみんなに教える" href="http://twitter.com/home?status=%E2%80%BB1%E5%86%86%E9%96%8B%E5%A7%8B*BAPE%E7%BE%8E%E5%93%81%E3%80%90%E3%83%89%E3%83%83%E3%83%88%E6%9F%84%E5%A4%A7%E7%8C%BF%E3%83%9E%E3%83%83%E3%83%89%E3%83%95%E3%82%A7%E3%82%A4%E3%82%B9T%E3%82%B7%E3%83%A3%E3%83%84%E3%80%91%E7%99%BDL%20http%3A%2F%2Fpage7.auctions.yahoo.co.jp%2Fjp%2Fauction%2Fg91317349%20%23yauc" target="twit"><img border="0" src="http://i.yimg.jp/images/commerce/js/blogparts/twitter/1.0.0/tweetthis-teal16.png"></a></div>（<a href="http://topic.auctions.yahoo.co.jp/staffblog/planner/twitter/">Twitterとは</a>）</div>

と見れてますよ。

お礼

yyr446さん、そして、皆さん、こんにちは。いつも回答頂きありがとうございます。

>そもそも、「ファイルメニュー>名前を付けて保存で、自分の指定するフォルダに保存」
>て何の事ですか？、

　説明が、不十分で申しわけありません。
　INTERNET EXPLORER 6 SP1の表示のメニューバーから(表示)をクリックしますと一覧が表示されますので、その中から
　ソース
　を選択します。IEのソース表示のアプリを秀丸エディタにしてあるので、秀丸エディタが、起動します。
　htmlのソースを表示することができます。
　秀丸エディタのメニューバーから、ファイルを選択します。
　名前を付けて保存
　を選択します。名前を付けて保存のダイアログがでます。

　保存する場所の右にある矢印を押して、自分の指定するフォルダを選択します。
　〔OK〕をクリックします。ソースを保存します。

　マイコンピュータから自分の指定するフォルダを選択します。保存したソースファイルをダブルクリックします。
　IEが起動して画像が表示されます。

>IEのソース表示のアプリを秀丸エディタにしてあるって事ですか？

　ご指摘の通りです。

>「ソースから開いた内容」って、秀丸エディタにHTMLのプレビュー機能ありましたっけ？

　秀丸エディタには、HTMLのプレビュー機能は、ありません。マイコンピュータから、ファイルを指定してファイルをダブルクリックすると画像が表示されます。

>保存したソースを自分のサイトにアップして、IEで見て見れないという事ですか？

　マイコンピュータから、ファイルを指定してファイルをダブルクリックすると画像が表示されます。これが、最初に表示された内容と異なって表示されるということです。

　自分が作ったサイトではなく、参照したままのソースです。

(●Q01)　分っていただけたでしょうか?

>ちなみに、ご提示のページをFireBugの動的なソース表示で見ると、
>該当部分は、
>
><div id="twitter_area">この商品をTwitterへ投稿（外部サイト）<div id="twitter_rt"><a title="このURLをTwitterでみんなに教える" href="http://twitter.com/home?status=%E2%80%BB1%E5%86%86%E9%96%8B%E5%A7%8B*BAPE%E7%
>と見れてますよ。

(●Q02)FireBugの動的なソース表示
とは、どのようにして表示させるのでしょうか?

　たとえ、一つだけでも、お知りのことが有りましたら、
　よろしく教授方お願いします。　　　　　　　　　　　　　　　敬具

回答No.3

yyr446

(●Q01)　分っていただけたでしょうか?
=>ご提示のページの仕組みを解析する根性がないので、何時、どのように
アイコン部分の<img>要素が挿入されるかお答えする事は出来ません。
DOM操作だけなのか、AJAXなのか、サーバーサイドの仕組みなのか．．．
とにかく、最初にブラウザーにロードされる時は無いのです。その後
プログラムによってブラウザー内で、ページ遷移することなく内容が
書き換えられているのです。この技法は数年前からあります。
そういった意味で動的に書き換えられらたHTMLページです。
ソース表示出来るのは、最初の状態だけです。

(●Q02)FireBugの動的なソース表示方法
＝＞FireBugというのは、FireFoxという有名なブラウザー（もちろんWinのユーザーも
たくさんいて、IE8より普及してそうな）のアドオンツールで、表示中のHTMLのソース
（HTML要素、javascript、CSS...）を解析・デバッグするのに使います。
IEの場合、確かIE8以降、同等とはいえませんが似たようなツールが付属されてます。
ツールメニューの「開発者ツール」です。F12キーで立ち上がると思います。
「開発者ツール」のHTMLタブを開いたまま、該当部分をIE画面で選択すると、
その部分の現状のソースコードが見れるはずです。

お礼

ソースが動的に変更されるということですね。
　Java Scriptでは、記載されているソースの表示と実際のホームページでは、差異があることは、他でも、経験があります。

　Java Scriptのことなど、もう少し調べてみたいと考えています。
　貴重な解説ありがとうございます。

　敬具

回答No.1

yyr446

質問の意味がよくわからないのですが．．．．
(●Q01)　しかし、インターネットから、開いた内容とソースから開いた内容では、表示内容が異なります。両者を同じにしたいのですがどのようにすれば良いでしょうか?
＝＝＞
そもそも、「ファイルメニュー>名前を付けて保存で、自分の指定するフォルダに保存」
て何の事ですか？、IEのソース表示のアプリを秀丸エディタにしてあるって事ですか？
「ソースから開いた内容」って、秀丸エディタにHTMLのプレビュー機能ありましたっけ？
保存したソースを自分のサイトにアップして、IEで見て見れないという事ですか？