HTML文字列を取得→加工→書き出すスクリプト

このQ&Aのポイント
  • JavaScriptを使用して、HTML文字列を取得し、加工し、書き出すスクリプトを作成する方法を教えてください。
  • CGI(perl)がHTMLを書き出すが、ハイパーリンクに加え親フォルダへのリンクも併設したいです。JavaScriptを使用して実現できますか?
  • JavaScriptを使ってHTML文字列を取得し、ハイパーリンクに親フォルダへのリンクを加えるスクリプトを作成したいです。
回答を見る
  • ベストアンサー

HTML文字列を取得→加工→書き出すスクリプト

CGI(perl)がこういうHTMLを書き出すのですが、 <html> <body> <p><a href="file:///C:\temp\hoge1.txt">file:///C:\temp\hoge1.txt</a></p> <p><a href="file:///C:\temp24\hoge2.txt">file:///C:\temp24\hoge2.txt</a></p> :(中略) <p><a href="file:///C:\temp78\hoge15.txt">file:///C:\temp78\hoge15.txt</a></p> </body> </html> ↑のハイパーリンクに加え、hoge.txtが置かれている親フォルダへの リンクも併設したいです。イメージとしては、次のような感じです、 <html> <body> <p><a href="file:///C:\temp\hoge1.txt">file:///C:\temp\hoge1.txt</a><br> ↑のファイルがあるフォルダを開くなら<a href="file:///C:\temp\">こちら</a></p> <p><a href="file:///C:\temp24\hoge1.txt">file:///C:\temp24\hoge1.txt</a><br> ↑のファイルがあるフォルダを開くなら<a href="file:///C:\temp24\">こちら</a></p> :(中略) <p><a href="file:///C:\temp78\hoge15.txt">file:///C:\temp78\hoge15.txt</a><br> ↑のファイルがあるフォルダを開くなら<a href="file:///C:\temp78\">こちら</a></p> </body> </html> みたいに、ページを表示するたびに フォルダパスも記述されるという… JavaScriptで実現できますでしょうか?よろしくお願い致します。

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

  • ベストアンサー
  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.2

このままじゃ実用性ないけど道楽で作ってみました。参考までに。 ページ内の全リンクに「<br>↑のファイルがある…」が足されます。一部のリンクだけに足すようにするにはなにか条件が必要です。 (あるIDを持つDIV配下のリンクだけにするとか、あるclassを持つアンカーだけにする等。) <html> <head> <title></title> <script type="text/javascript"> <!-- function hoge() { var AnchorList = document.getElementsByTagName('A'); if(! AnchorList) return; var AddObjList = new Array(); var i; for(i=0;i<AnchorList.length;i++) { var Href = AnchorList[i].getAttribute('href'); Href.match(/\/|\\/g); Href = RegExp.leftContext + RegExp.lastMatch; AddObjList.push([AnchorList[i].parentNode,Href]); } for(i=0;i<AddObjList.length;i++) { AddObjList[i][0].innerHTML = AddObjList[i][0].innerHTML+ '<br>↑のファイルがあるフォルダを開くなら<a href="'+AddObjList[i][1]+'">こちら</a>'; } } //--> </script> </head> <body onload="hoge()"> <p><a href="file:///C:\temp\hoge1.txt">file:///C:\temp\hoge1.txt</a></p> <p><a href="file:///C:\temp24\hoge1.txt">file:///C:\temp24\hoge1.txt</a></p> <p><a href="file:///C:\temp78\hoge15.txt">file:///C:\temp78\hoge15.txt</a></p> </body> </html>

litton101
質問者

お礼

steel_grayさん、再々のレスありがとうございます。 早速組み込んでみましたが、すばらしいです。 動作の方、イメージしたとおりで*完璧*でした。 今後の応用も効きそうだし、重宝させていただきます。 本当にありがとうございます。

その他の回答 (1)

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.1

CGIスクリプトで吐き出したHTMLを加工したいのならば、 Javascriptを組み込むにしても、HTMLを吐き出す部分への改造は少なからず必要なわけですからCGIスクリプトの方を改造したほうがてっとり早いと思います。 CGI本体は基本的に変更できないけど、(HTMLの)この部分なら変更できるって制約などがあるなら、あらかじめ提示してもらわないとjavascriptでの実現方法を書いても無駄になりそうだし。

litton101
質問者

お礼

steel_grayさん、レスありがとうございます。 まったくアドバイスのとおりです。CGIもJavascriptもほとんど理解しておらず、恥ずかしい質問失礼しました。

関連するQ&A

  • IDの持たせ方 (Re: IDのHTML文字列を…)

    すみません、締め切った質問ですが、ご回答くださった steel_grayさんが予測されていた通り(下記)、 > ページ内の全リンクに「<br>↑のファイルがある…」が足されます。 > 一部のリンクだけに足すようにするにはなにか条件が必要です。 > (あるIDを持つDIV配下のリンクだけにするとか、 > あるclassを持つアンカーだけにする等。) '一部のリンクだけに' リンクを足すようにしたいの ですが、、、。自分なりに考えてみたのは、 (1) <head>内のスクリプトで下記の部分を改訂 var AnchorList = document.getElementsByTagName('A'); ↓ var AnchorList = document.getElementById('folder'); # getElementByIdでいいのですよね?getElement【s】ByIdでなく (2) <body>内の「<br>↑のファイルがある…」を挿入したい部分に<div>タグ+IDを追加 <div id="folder"> <a href="file:///C:\temp\hoge1.txt">file:///C:\temp\hoge1.txt</a> </div> でも、動作せず、スクリプトエラーにもならず、です。 何が誤っていますでしょうか。 すみません、よろしくお願い致します。

  • HTMLで各PCのDataを表示する

    WWWサーバにあるIndex.htmlから各Userが利用している 「C:\temp\User.txt」の内容を表示するにはどうしたら いいでしょうか? 今は、リンク先をクリックしても、カチッと音がして画面は一切更新されません。 ------ <a href="file://C:/temp/User.txt">個人データ表示</a> ------ ↑のように記述しているのですが、書き方を下のよう変えてみたのですがうまくいきません。 <a href="<file://C:/temp/User.txt>">個人データ表示</a> <a href="C:/temp/User.txt">個人データ表示</a> <a href="<127.0.0.1//C$/temp/User.txt>">個人データ表示</a> WWW_Server内に保管すれば表示されることは確認出来ましたが 各Userが利用しているPC内に保管して、各個人が直接 「User.txt」を編集出来るようにしたいと考えています。 どなたか知恵を貸して下さい。よろしくお願いします。

    • ベストアンサー
    • HTML
  • シェルスクリプトがちゃんと動かない

    よろしくおねがいします。 fileフォルダに 1.txt 2.txt 3.txt というファイルがあり、ここから1.txtを別フォルダに移動します。 (ここまでは問題ありません) その後fileフォルダには 2.txt 3.txt というファイルが残るのですが、このファイル名を自動的に 1.txt 2.txt と連番でリネームしたく #!/bin/sh declare -i i=1 for file in *.txt do mv $file $i.txt i=i+1 done をhoge.shとして準備しました。 Mac OS X(Darwin)では思い通りに実行されるのですが、Webサーバ(FreeBSD 6.1-RELEASE-p21)にアップし %sh hoge.sh とすると declare: not found となり、ファイルの方も .txt i+1.txt の2ファイルになってしまいます。 あまり知識も無く勉強しながらなのですが、きちんと連番で書き換えられるようにするにはどうすればよろしいでしょうか? 根本的に間違ってる事などあるかと思いますがよろしくおねがいします。

  • SED等で文字列を抽出したい

    MacOS X 10.6のターミナルを使って文字列を加工して抽出する方法の質問です。 次のような複数行からなるテキスト(ファイル名を 1.txt とします)があります。 <a href="./hoge/82111.310.12345000.htm" target="_blank"> <a href="./hoge/42403.310.33345025.htm" target="_blank"> <a href="./hoge/22154.310.50873323.htm" target="_blank"> ... このテキスト(1.txt)から、sed(?もっと適切なものがあれば別のものでも)コマンド を用いて 82111.12345000.htm 82401.33345025.htm 82111.50873323.htm ... といった具合に、 hoge/ のあとから始まり htmで終わる文字列から .310を取り除いた文字列を抜き出して ファイル一覧のテキスト(2.txt) に書き出す方法を教えてください。 なお、1.txtの行数は不定で変動し、その行数に応じて2.txtも行数が増えていきます。 また htmのファイル名のところは 5桁のランダムな数字.310.8桁のランダムな数字.htm という規則になっています。(.310 と.htm の部分は固定です) よろしくお願いします。

  • バッチファイル 文字列操作のやり方

    お世話になります。 バッチファイルのコマンドについてですが、 for文の中で 一番下の階層のファイル名の先頭5バイトが "abcde"のものだけ処理対象にしたいと考えています。 例えば、 C:\tempに以下のファイルがあったら C:\temp\abcdefg.txt    ・・・(1) C:\temp\xxxxxxx.txt    ・・・(2) C:\temp\abcde.txt    ・・・(3) C:\temp\abc.txt    ・・・(4) C:\temp\abcdezzzz.txt    ・・・(5) (1)、(3)、(5)だけを処理させたいと考えています。 実装方法として、以下を考えましたがうまくいきません。 dir /s /b /a-d C\Temp > file.txt for /f "delims=" %%F in (file.txt) do ( set A=%%~nF% if "%%A:~0,5%"=="abcde" ( <処理コマンド> ) ) おそらくfor文の中で何個も命令を記述できないということと、 パラメータ修飾子の指定が間違っているからだと思われますが、 うまくできない理由を知りたいです。 よろしくお願いいたします。

  • 30日経過したファイルとサブフォルダを削除したい

    \Temp内にあるファイル(サブフォルダを含む)を精査し、作成から30日経過しているファイルと、それによって空になったサブフォルダを削除したいのですが、うまくいきません。 <実行前フォルダ構成> ¥temp 経過日数   \A  A1.txt 20   A2.txt 30 削除対象  A3.txt 40 削除対象   \B 削除対象  B1.txt 30 削除対象   B2.txt 30 削除対象  B3.txt 30 削除対象 <期待している結果> \temp 経過日数   \A  A1.txt 20 まず、以下のコマンドをを実行してみました。 forfiles /P C:\temp /S /D -30 /C "cmd /c del /F /S /Q C:\temp\FTP-test\@file" 実行結果は以下のようになり¥Bが削除されませんでした。 <実行結果> ¥temp 経過日数   \A  A1.txt 20   \B 次に、以下のように書き換えて実行してもダメでした(結果は同じでした)。 forfiles /P C:\temp\FTP-test /d -30 /c "cmd /c if @isdir==true rmdir /Q /S @file" 解決方法が解れば教えて頂ければ幸いです。

  • Perlで フォルダ内の全てのファイルを別のフォルダにコピーするには

    お世話になります。 多分ご存知の方には簡単な話だと思いますが教えていただけませんか。 Aフォルダにあるhoge.txtをBフォルダにコピーしたければ use File::Copy; copy "./A/hoge.txt", "./B/hoge.txt" or die $!; で出来るのはわかっているのですが、Aフォルダにある全てのファイルをBフォルダにコピーするというのはどのようなコードを書いたらよいのでしょう。 ちなみにAフォルダには100以上ファイルがあります。ファイルは全部テキストファイルです。

    • ベストアンサー
    • Perl
  • ¥を含む文字列を挿入するとエラーとなります

    こんにちわ、よろしくお願いします。 OS:WindowsXP PostgreSQL:8.4.0 DBの文字コードはUTF8で構築しています。 【現象】 文字型のカラムに¥を含んだ文字列を挿入しようとすると以下のエラーになります。 WARNING: nonstandard use of escape in a string literal at character 331 SQL実行中に以下のエラーが発生しました。 ERROR: invalid byte sequence for encoding "UTF8": 0x00 エラーとなるのは例えば「C:\temp\hoge.txt」といった文字列です。 ただし、 「C:/temp/hoge.txt」 「C:\\temp\\hoge.txt」 とした場合は正常に挿入が出来ます。 8.1.11で同じプログラムを動かしているときは問題なく動作していました。 PostgreSQLを最新の8.4.0にバージョンアップしたところ上記のエラーが発生するようになりました。 エンコードの問題かと思い Postgresql.confのclient_encodingを色々設定してみましたが、解決しませんでした。 解決法が見当たらず困っています。 よろしくお願い致します。

  • HTMLのフレームについて

    左側にメニューを置き、右側をメインにしようとしているのですが、左側のメニューをクリックしても、左側にしか表示されません。 どうすれば良いか教えてください 全体のHTMLが <html> <Html Lang="ja"> <Head> <Title>○</Title> </Head> <Frameset cols="155,*" Frameborder="yes" Scrolling="auto" Bordercolor="#ffcc99"> <Frame src="メニュー~"> <Frame src="メイン~" name="main"> <Noframes> <body> <Center> <p> ○ </p> </Center> </body> </Noframes> </Html> 左(メニュー)のフレームは <html> <Html Lang="ja"> <Head> <Meta Http-equiv="content-type" Content="text/html; charset=Shift_JIS"> <Title>○</Title> </Head> <Body> <BaseFont Size="2"> <Font Size="2"> <A Href="~" target="main"></A><Img Src="ー" Border="0"></A><br> <br> <A Href="~" target="main"><Img Src="ー" Border="0"></A><br> <br> <A Href="~" target="main"><Img Src="ー" Border="0"></A><br> <br> <A Href="~" target="main"><Img Src="ー" Border="0"></A><br> <br> <A Href="~" target="main"><Img Src="ー" Border="0"></A><br> <br> <A Href="~" target="main"><Img Src="ー" Border="0"></A><br> </Body> </Html> ですよろしくお願いします

  • シェルスクリプトの実行結果が毎回異なってしまいます

    お世話になります。 UNIX初心者です。 作成したシェルスクリプトを実行するたびに、結果が異なります。 正常に実行され、期待どおりの結果になる場合もありますが、 スクリプトの修正などをを全くしていないにも関わらず、ほぼ毎回異なる 結果になります。 ※変数に値が代入されなかったりして、文法エラーになったり、 エラーにならなくても結果が毎回違います。 以下に問題のスクリプトを記載しておりますが、内容を簡単に言いますと、 csvファイルの内容(ファイルサイズ、ファイル名の一部)を 読み取り、その内容を新しいファイルに書き出すというものです。 ※もちろんスクリプト実行時に読み込むcsvファイルは毎回同じものを使用しています。 初心者なので、何が悪いのか目処すらたちません。 ご教示頂ければ幸いです。 宜しくお願い致します。 【スクリプト内容】(長くなってしまいすいません) #!/bin/sh find /var/apache/htdocs/colo/test_batch2/ -name "RACK_*" > temp_file1 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file1 |tee temp_file1 old_file_name=`cat temp_file1` sed -e s/csv/ar/ temp_file1 |tee temp_file1 file_name=`cat temp_file1` sed -e s/RACK_//g temp_file1 |tee temp_file1 sed -e s/.ar//g temp_file1 |tee temp_file1 file_cre_time=`cat temp_file1` wc -c $old_file_name |tee temp_file2 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file2 |tee temp_file2 sed -e s/$old_file_name//g temp_file2 |tee temp_file2 file_size=`cat temp_file2` echo $file_name echo $file_size echo $file_cre_time touch $file_name echo '"'$file_cre_time'"' ',"'$file_size'"'|tee $file_name echo $file_name|tee temp_file3 sed -e s/ar/txt/g temp_file3 |tee temp_file3 txt_name=`cat temp_file3` touch $txt_name find /var/apache/htdocs/colo/test_batch2/ -name "AREA_*" > temp_file4 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file4 |tee temp_file4 old_file_name=`cat temp_file4` sed -e s/csv/ar/ temp_file4 |tee temp_file4 file_name=`cat temp_file4` sed -e s/AREA_//g temp_file4 |tee temp_file4 sed -e s/.ar//g temp_file4 |tee temp_file4 file_cre_time=`cat temp_file4` wc -c $old_file_name |tee temp_file5 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file5 |tee temp_file5 sed -e s/$old_file_name//g temp_file5 |tee temp_file5 file_size=`cat temp_file5` echo $file_name echo $file_size echo $file_cre_time touch $file_name echo '"'$file_cre_time'"' ',"'$file_size'"'|tee $file_name echo $file_name|tee temp_file6 sed -e s/ar/txt/g temp_file6 |tee temp_file6 txt_name=`cat temp_file6` touch $txt_name find /var/apache/htdocs/colo/test_batch2/ -name "BUIL_*" > temp_file7 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file7 |tee temp_file7 old_file_name=`cat temp_file7` sed -e s/csv/ar/ temp_file7 |tee temp_file7 file_name=`cat temp_file7` sed -e s/BUIL_//g temp_file7 |tee temp_file7 sed -e s/.ar//g temp_file7 |tee temp_file7 file_cre_time=`cat temp_file7` wc -c $old_file_name |tee temp_file8 sed -e s/\\/var\\/apache\\/htdocs\\/colo\\/test_batch2\\///g temp_file8 |tee temp_file8 sed -e s/$old_file_name//g temp_file8 |tee temp_file8 file_size=`cat temp_file8` echo $file_name echo $file_size echo $file_cre_time touch $file_name echo '"'$file_cre_time'"' ',"'$file_size'"'|tee $file_name echo $file_name|tee temp_file9 sed -e s/ar/txt/g temp_file9 |tee temp_file9 txt_name=`cat temp_file9` touch $txt_name

専門家に質問してみよう