- ベストアンサー
VBSでHTMLを簡単に出力！
- VBSを使用して、フォルダ内のファイルをHTMLに変換し一覧表示する方法を教えてください。
- 現在、プログラムを組む際にメモ帳に貼り付けて保存しているが、見づらくなってしまうため、自動的にHTMLを作成する方法を模索している。
- 目次別にフォルダ内のファイルを整理して表示し、クリックすると右側にその内容を表示できる方法があれば教えてほしい。
- satoron666
- お礼率86% (306/354)
- Visual Basic
- 回答数8
- ありがとう数9
- みんなの回答 （8）
- 専門家の回答
質問者が選んだベストアンサー
余談ですが・・・・ >VBSで、凝ったHTMLを出力する！ という事ですので、もう少し（見た目的に）凝ってみます。 CSSファイルを以下のようにすると添付画像のようになります。 あくまで一例ですので、CSSでいろいろ触ってみてください。 VBSコードは回答No7のものを使用しています ■main.css a.menu { padding: 0 100px 0 10px; border: 1px solid #8080ff; text-decoration: none; background-color: #ccccff; } a.menu:hover { background-color: #ccffff; border-color: blue; } h1 { font-size: 1.25em; } li { line-height: 2em; list-style-type: none; } p.note { font-size: 80%; line-height: 1.3; } li.dir { list-style-type: none; color:#F0F; margin: 15px 0 0 0; padding: 0 15px 15px 10px; border-style: solid; border-width: 1px; border-color: #aaa #333 #333 #aaa; -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; font-size: 14px; line-height: 10px; text-decoration: none; text-shadow: 1px 1px 1px #FFF; background-color:#DDD; }
その他の回答 (7)
- eden3616
- ベストアンサー率65% (267/405)
申し訳ありません。 No6のVBSコード訂正です。 ■VBSコード ' 型宣言 Dim reed_file Dim Result Dim html Dim buf Dim i Dim j Dim cnt ' 検索を行うフォルダ設定 SEARCH_DIR = "TEST" ' テキストファイル処理 Set fso = CreateObject("Scripting.FileSystemObject") ' 出力ファイル作成 Set oTs2 = fso.CreateTextFile("index.html",True) ' ヘッダー出力 Set reed_file = fso.OpenTextFile("head.txt") oTs2.WriteLine reed_file.ReadAll() ' サブのメソッドを呼び出し Call Sub_SearchDir(SEARCH_DIR,"") Result = split(buf,vbcrlf) ' リストHTML作成 buf = "" cnt = 0 For i = 1 To UBound(Result) html = Split(Result(i), "|") If html(0) = bkno Or html(0) < bkno Then For j = 1 To cnt - html(0) buf = buf & "</ul></li>" & vbCrLf cnt = cnt - 1 Next End If ' フォルダタグ格納 buf = buf & "<li class=""dir""><a href=""#"" class=""menu"" onclick=""sublist(this); return false;"">" & html(1) & "</a><ul>" & vbCrLf ' ファイルタグ格納 For j = 2 To UBound(html) - 2 buf = buf & "<li><a href=" & html(UBound(html) - 1) & html(j) & ">" & html(j) & "</a></li>" & vbCrLf Next ' 前回控え bkno = html(0) cnt = cnt + 1 Next ' リスト終了タグ格納 buf = buf & "</ul></li>" ' ルートディレクトリのファイル格納 html = Split(Result(0), "|") For j = 0 To UBound(html) - 2 buf = buf & "<li><a href=" & html(UBound(html) - 1) & html(j) & ">" & html(j) & "</a></li>" & vbCrLf Next ' リストHTML出力 oTs2.WriteLine buf ' フッダーHTML出力 Set reed_file = fso.OpenTextFile("foot.txt") oTs2.WriteLine reed_file.ReadAll() ' ファイルを閉じる oTs2.Close '――――――――――――――――――――――――――――――――――― ' ディレクトリ階層取得 '――――――――――――――――――――――――――――――――――― sub Sub_SearchDir(branchpath , deps) Dim fsoFolder Dim fsoSubFolder Dim fsoFile Dim path 'フォルダオブジェクト取得 Set fsoFolder = fso.GetFolder(branchpath) 'フォルダ内/ファイルループ For Each fsoFile In fsoFolder.Files 'ファイル名を出力 buf = buf & deps & fsoFile.name & "|" Next path = split(branchpath,"\") buf = buf & branchpath & "\|" 'サブフォルダを検索 Set branch = fso.getfolder(branchpath) For each f in branch.subfolders cnt = cnt + 1 'フォルダ名を出力 buf = buf & vbcrlf & deps & ubound(path) & "|" & f.name & "|" 'さらにサブフォルダを探索 Call Sub_SearchDir(branchpath & "\" & f.name , deps) Next End Sub ' 終了処理 Set fsoFolder = Nothing Set reed_file = Nothing Set oTs2=Nothing Set fso=Nothing Set branch = nothing msgbox "終了しました"
- eden3616
- ベストアンサー率65% (267/405)
度々お邪魔します。 再帰処理でサブフォルダ以下を階層表示するようにコードを変更してみました。 多段階層に対応しています。 こちらの方が柔軟性があると思います。 出力結果は添付画像を参照願います（小さいですが） 他のファイルはそのままで、VBSファイルだけ以下のコードと差し換えてください。 ■VBSコード ' 型宣言 Dim key Dim reed_file Dim Result Dim html Dim path Dim buf Dim i Dim j Dim f_buf Dim d_buf ' 検索を行うフォルダ設定 SEARCH_DIR = "TEST" ' テキストファイル処理 Set fso = CreateObject("Scripting.FileSystemObject") ' 出力ファイル作成 Set oTs2 = fso.CreateTextFile("ｔest.html", True) ' ヘッダー出力 Set reed_file = fso.OpenTextFile("head.txt") oTs2.WriteLine reed_file.ReadAll() ' サブのメソッドを呼び出し Call Sub_SearchDir(SEARCH_DIR, "") Result = Split(buf, vbCrLf) ' リストHTML作成 buf = "" For i = 1 To UBound(Result) html = Split(Result(i), "|") ' リスト終了タグ格納 If html(0) < bkno Then For j = 1 To bkno buf = buf & "</ul></li>" & vbCrLf Next End If If (html(0) = 0) And (i > 1) Then buf = buf & "</ul></li>" & vbCrLf End If ' フォルダタグ格納 buf = buf & "<li class=""dir""><a href=""#"" class=""menu"" onclick=""sublist(this); return false;"">" & html(1) & "</a><ul>" & vbCrLf ' ファイルタグ格納 For j = 2 To UBound(html) - 2 buf = buf & "<li><a href=" & html(UBound(html) - 1) & html(j) & ">" & html(j) & "</a></li>" & vbCrLf Next ' 前回控え bkno = html(0) Next ' リスト終了タグ格納 buf = buf & "</ul></li>" ' ルートディレクトリのファイル格納 html = Split(Result(0), "|") For j = 0 To UBound(html) - 2 buf = buf & "<li><a href=" & html(UBound(html) - 1) & html(j) & ">" & html(j) & "</a></li>" & vbCrLf Next ' リストHTML出力 oTs2.WriteLine buf ' フッダーHTML出力 Set reed_file = fso.OpenTextFile("foot.txt") oTs2.WriteLine reed_file.ReadAll() ' ファイルを閉じる oTs2.Close '――――――――――――――――――――――――――――――――――― ' ディレクトリ階層取得 '――――――――――――――――――――――――――――――――――― Sub Sub_SearchDir(branchpath, deps) Dim fsoFolder Dim fsoSubFolder Dim fsoFile Dim path 'フォルダオブジェクト取得 Set fsoFolder = fso.getfolder(branchpath) 'フォルダ内/ファイルループ For Each fsoFile In fsoFolder.Files 'ファイルの情報を出力 (名前、サイズ、最終更新日時) buf = buf & deps & fsoFile.Name & "|" Next path = Split(branchpath, "\") buf = buf & branchpath & "\|" 'サブフォルダを検索 Set branch = fso.getfolder(branchpath) For Each f In branch.subfolders cnt = cnt + 1 'フォルダ名を出力 buf = buf & vbCrLf & deps & UBound(path) & "|" & f.Name & "|" 'さらにサブフォルダを探索 Call Sub_SearchDir(branchpath & "\" & f.Name, deps) Next End Sub ' 終了処理 Set reed_file = Nothing Set oTs2 = Nothing Set fso = Nothing Set branch = Nothing Set fso = Nothing MsgBox "終了しました"
- eden3616
- ベストアンサー率65% (267/405)
度々捕捉です・・・。 >main.cssの編集が必要なのでしょうか？ 利用しているJavascriptについてなんですが、 以下のような記述で階層はどんどん増やすことが出来ますので VBSlコード以外は現状のままでも問題ないと思います。 CSSについては先頭の「・」マークや「１、２・・・・」、文字フォントや背景色いろいろ変更できます。 「class」や「id」をタグ内に記述すれば任意箇所の様式も設定可能となります。 CSS記述方法及び設定方法は別途勉強する必要があります。 また、今回使用していますJavascriptは一例です。。。 jQueryなどと組み合わせればより素敵なフォルダツリー様式を実装できると思います。 http://www.tohoho-web.com/tech/tree-menu.htm http://booyan.lopan.jp/js_treeview/ http://www.ne.jp/asahi/hatakeyama/design/csslayout/ajaxtest/index13.html 現状のJavascriptにおいて、多段化したときのサンプルを載せておきます。 （ディレクトリのliタグにclass="dir"を設定し、CSSにdirの書式を定義しています） ■多段ツリーのHTML例 <ul> <li class="dir"><a href="#" class="menu" onclick="sublist(this); return false;">A</a> <ul> <li class="dir"><a href="#" class="menu" onclick="sublist(this); return false;">C</a> <ul> <li class="dir"><a href="#" class="menu" onclick="sublist(this); return false;">D</a> <ul> <li><a href="loot/D/1.html">1.html</a></li> <li><a href="loot/D/2.html">2.html</a></li> </ul> </li> <li><a href="loot/C/3.html">3.html</a></li> <li><a href="loot/C/3.html">4.html</a></li> </ul> </li> <li><a href="loot/A/6.html">5.html</a></li> <li><a href="loot/A/6.html">6.html</a></li> </ul> </li> <li class="dir"><a href="#" class="menu" onclick="sublist(this); return false;">B</a> <ul> <li><a href="loot/B/7.html">7.html</a></li> <li><a href="loot/B/8.html">8.html</a></li> </ul> </li> </ul> ■CSSファイル li { line-height: 1.45; list-style-type: decimal; } li.dir { list-style-type: disc; }
- eden3616
- ベストアンサー率65% (267/405)
>フォルダの階層がさらに増えた場合には、 >main.cssの編集が必要なのでしょうか？ 現在のコードでは階層が増えた場合に対応していませんが 考え方は同じです >HTML加工部分のReplace(Result," ├─","1") >をReplace(Result," │ ├─","3") >Replace(Result," │ │","4") >とか追加し、caseを増やせば良いのかと思うのですが、 >合ってますでしょうか？ はい。ただし数値には以下のように使用しています。 VBSコードをよく見て頂ければわかるのですが、 1やら2やらの数字は状態を判定するためのキーワードとして、 各行の先頭に1文字設けているものです。 この値を後から参照し、対応する番号に対応するHTMLの様式を与えています。 全体的な流れを説明しますと・・・・ 「test.txt」というテキストファイルに「tree /f > out.txt」と記述し ファイル名を「test.bat」に変更します。 このtest.batを「TEST」フォルダと同じ階層に置いてダブルクリックすれば 以下のようなテキストファイルが出力されます。 ――――――――――――――――――― フォルダー パスの一覧: ボリューム OS ボリューム シリアル番号は 3845-C6CB です C:. │ out.txt │ test.bat │ └─TEST ├─シート │ シート編集.html │ 新規シート.html │ └─ブック ブック名編集.html 新規ブック.html ――――――――――――――――――― これはWindowsのコマンドプロンプトでtreeコマンドにオプション 「/ｆ（ファイルを出力）」を付けてout.txtファイルへ書き出す バッチファイルになります。 VBSコード内でプロンプトのコマンドを実行し、 処理結果を取得して文字列加工しています。 (1)処理結果は変数「Result」に格納されます (2)変数keyに「└─TEST」を代入し、Resultの先頭からkeyを見つけ出しそこまでを削除 (3)「 ├─」やら「 └─」を置換Replaiceし、判定数値に置換「1」やら「2」やら。 この段階でResultの中身は以下のようになります。 ―――――――――― 1シート 2シート編集.html 2新規シート.html 3 1ブック 2ブック名編集.html 2新規ブック.html ―――――――――― (4)ResultをSplit関数で改行コード（vbCrLf）で区切り配列変数htmlに格納 (5)For Each Result in html ～ Loop で各要素に対し以下の処理を行う ※）この段階で変数Resultは不要になるので 各行の要素の値をResultに格納し直しています (6)Left関数で1文字を取り出し、その数値をSelect caseで条件分岐し (7)各条件「1」「2」「3」の場合に対応するHTMLを結合してテキストファイルへ書出し ですので、実際に目的の階層を作成し、 上記の「test.bat」を実行してみて出力される「out.txt」と睨めっこしながら 文字列加工を上記のように行えば3階層、4階層なども出来るかと思います。 フォルダ階層をVBSで回帰的に処理し取得すれば多段対応できると思いますが、 手っ取り早いのでtreeコマンドを利用しました。
- eden3616
- ベストアンサー率65% (267/405)
No2のものです。 連続した半角スペースがOKwaveの仕様で消えてしまいますね。 外部サーバに各ファイルをアップロードしましたので参考にどうぞ。 ■foot.txt https://www.dropbox.com/s/gz1dg3hkkjygwr2/foot.txt ■head.txt https://www.dropbox.com/s/itmlnlotca7aras/head.txt ■main.css https://www.dropbox.com/s/pi9g6droshijtiz/main.css ■VBSコード（拡張子をvbsに変更してください） https://www.dropbox.com/s/315zwecpvnhcjge/test.vbs.txt -------------補足------------- ・Javascriptで展開させるコードは以下のものを使用しています。 http://allabout.co.jp/gm/gc/377237/ ・CSSでリストへスタイルを適用させる方法は以下のサイトを参考にどうぞ http://www.tagindex.com/stylesheet/list/index.html
- eden3616
- ベストアンサー率65% (267/405)
■手順 ※全て「TEST」ディレクトリと同じ階層（HTML化用ファイルの下）に作成してください (1)お好きな名前でVBSファイルを作成して「■VBSコード」をコピペ コード内の以下の箇所を設定（階層の一番上のフォルダ名としてください） ' 設定 key = "TEST" (2)「head.txt」を作成して以下の「■head.txt」をコピペ (3)「foot.txt」を作成して以下の「■foot.txt」をコピペ (4)「main.css」を作成して以下の「■main.css」をコピペ (5)(1)で作成した「○○○.vbs」を実行 同じ階層に「test.html」が出力されます。 （ファイル名を変更する場合は(1)の「' 出力ファイル作成」箇所を変更） 出力されるメインの階層リストはVBSで取得・加工し、 それ以外は外部テキストファイルとして以下のファイルに記述しています。 ・head.txt ・・・ ヘッダーのHTML ・foot.txt ・・・ フッダーのHTML ・main.css ・・・ CSSファイル リストのデザイン変更はCSSファイルまたは、 VBSコード内の「' HTML加工」あたりを触ってください。 ■VBSコード ' 型宣言 Dim objShell Dim wExec Dim sCmd Dim key Dim reed_file Dim Result Dim html Dim path ' 設定 key = "TEST" ' プロンプト処理 Set objShell = CreateObject("WScript.Shell") ' テキストファイル処理 Set fso = CreateObject("Scripting.FileSystemObject") ' 出力ファイル作成 Set oTs2 = fso.CreateTextFile("ｔest.html",True) ' ヘッダー出力 Set reed_file = fso.OpenTextFile("head.txt") oTs2.WriteLine reed_file.ReadAll() ' コマンド生成 sCmd = "tree /f" ' コマンド実行 Set wExec = objShell.Exec("%ComSpec% /c " & sCmd) Do While wExec.Status = 0 Loop ' 取得 Result = wExec.StdOut.ReadAll ' 不要部分削除 key = "└─" & key Result = Right(Result,Len(Result)-Instr(Result,key)-Len(key)-1) ' HTML加工 key = Right(key,Len(key)-2) Result = Replace(Result," ├─","1") Result = Replace(Result," └─","1") Result = Replace(Result," │ " & vbcrlf,"3"&vbcrlf) Result = Replace(Result," │ " ,"2") Result = Replace(Result," " & vbcrlf,"3"&vbcrlf) Result = Replace(Result," " ,"2") html = Split(Result,vbcrlf) For Each Result in html Select case Left(Result,1) case "1" Result = Right(Result,Len(Result)-1) path = key & "/" & Result Result = "<li><a href=""#"" class=""menu"" onclick=""sublist(this); return false;"">" & Result & "</a><ul>" case "2" Result = Right(Result,Len(Result)-1) Result = "<li><a href=""" & path & "/" & Result & """>" & Result & "</a></li>" case "3" Result = "</ul></li>" end select ' メインHTML出力 oTs2.WriteLine Result Next ' フッダーHTML出力 Set reed_file = fso.OpenTextFile("foot.txt") oTs2.WriteLine reed_file.ReadAll() ' 終了処理 oTs2.Close Set wExec = Nothing Set objShell = Nothing Set reed_file = Nothing set oTs2=Nothing Set fso=Nothing ■head.txt <html> <head> <meta http-equiv="Content-Type" Content="text/html; charset=shift_jis"> <title>目録</title> <script type="text/javascript"><!-- // ▼下層リストの表示・非表示を切り替えるスクリプト function sublist( target ) { var TargetList = target.parentNode.getElementsByTagName('ul'); if ( TargetList[0].style.display == 'none' ) { TargetList[0].style.display = 'block'; } else { TargetList[0].style.display = 'none'; } } // ▼全サブリストの表示・非表示を一括して切り替えるスクリプト function allshowhide( showhide ) { var TargetLabels = document.getElementsByClassName('menu'); for (var i=0; i<TargetLabels.length; i++) { var TargetLists = TargetLabels[i].parentNode.getElementsByTagName('ul'); TargetLists[0].style.display = showhide; } } // --></script> <link rel="stylesheet" type="text/css" href="main.css"> </head> <body> <p> <input type="button" value="全部閉じる" onclick="allshowhide('none');"> <input type="button" value="全部展開" onclick="allshowhide('block');"> </p> <ul> ■foot.txt </ul> <script type="text/javascript"><!-- allshowhide('none'); // --></script> </body> </html> ■main.css /* ▼下層の表示・非表示を切り替えるリンク用の装飾 */ a.menu { border: 1px solid #8080ff; text-decoration: none; padding: 1px; background-color: #ccccff; margin-right: 2px; } /* ▼下層の表示・非表示を切り替えるリンクの上にマウスポインタが載ったとき用の装飾 */ a.menu:hover { background-color: #ccffff; border-color: blue; } /* ▼今回のサンプルとは関係のない装飾 */ h1 { font-size: 1.25em; } li { line-height: 1.45; list-style-type: disc; } p.note { font-size: 80%; line-height: 1.3; } li li { list-style-type: decimal; }
お礼
eden3616様、回答ありがとうございます。 毎回お世話になっております！ すごいプログラムです！ フォルダの階層がさらに増えた場合には、 main.cssの編集が必要なのでしょうか？ HTML加工部分のReplace(Result," ├─","1") をReplace(Result," │ ├─","3") Replace(Result," │ │","4") とか追加し、caseを増やせば良いのかと思うのですが、 合ってますでしょうか？ 回答ありがとうございました＾＾ 本当に助かりました！
*satoron666様 *VBSとHTMLに対する適切な回答ではありません。流し読みしてください。 36歳信託銀行内SEです（有給消化中） >メモ帳が大量にあり探すのにとても苦労しますし、 >内容もとても見づらいものになってしまいます。 情報整理のお話だとすると、アプローチそのものにアドバイスが出来ます。 ・既存サービスを使う。 例えば、Evernote等。 世の中には既にあなたの理想を具体的に実現できるツールが存在していると思います。 ツールの自作が目的ではないと感じたので、そういったツールの使用をおすすめします。 ・RubyやPython等、実現が容易な言語を使用する。 上記言語ではファイル操作、情報整理は1hで簡単なツールができます。 ファイル操作等であれば、VBよりは向いていると言えます。 ・歴史を手本にする。 「プロダクティブ・プログラマ」という書籍で、いかに効率的に作業をするか、という内容があり、 ファイル整理等も触れています。 そういった書籍やサイトから、先達のやり方を学びイイトコどりをしていきましょう。 ・個人的に ローカル環境と上記内容であればテキストエディタの「SublimeText」で、Project機能を使用するだけで、解決するような気はしています。 もしくは、EmEditor。 ファイラなら X-Finder。
お礼
avispax様、回答ありがとうございます。 自動的にHTML化し、色もつけ フレームをするとなると…慣れているプログラムのほうが 良いと思い、VBSでやろうと考えております。 ファイル整理も重要だとは思うのですが、 中々量が膨大でして、むずかしいものですね… できたら、このHTML化ツールを 会社の他の人にも使って貰おうと考えているので RubyやPythonを使うのはためらっておりました。 Rubyとか覚えるのに時間はかからないでしょうか… 主に、個人で使ってもらおうと思っていますが SublimeTextは課金なのですね… もっと段階を踏んで質問して行こうと思います！ ありがとうございました＾＾
お礼
回答ありがとうございました。 お礼が遅くなり、大変申し訳ありませんでした。 大変参考になりました！ cssもいろいろいじってみて、より良いものを作れるよう頑張ります！ 1文1文、どのようなプログラムなのかじっくり理解していきたいと思います。 また、この度アカウントが利用停止になってしまいました。 今後いつかあった時は、またよろしくお願いします＾＾