onebitious/Illustrator2HTML_CSS.jsx

## html、CSS
<!DOCTYPE html>
<html lang="ja">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        h1 {
            font-size: 31px;
            font-family: A-OTF 太ゴB101 Pr6N;
            font-weight: Bold;
            color: #009245;
            line-height: 54.25px;
            text-align: center;
            margin: 0;
        }

        h2 {
            font-size: 20px;
            font-family: A-OTF 見出ゴMB31 Pr6N;
            font-weight: MB31;
            color: #006837;
            line-height: 35px;
            text-align: left;
            margin: 0;
        }

        h3 {
            font-size: 15px;
            font-family: A-OTF UD新ゴ Pr6N;
            font-weight: L;
            color: #662D91;
            line-height: 26.25px;
            text-align: right;
            margin: 0;
        }

        h4 {
            font-size: 13px;
            font-family: A-OTF 見出ミンMA31 Pr6N;
            font-weight: MA31;
            color: #0000FF;
            line-height: 22.75px;
            text-align: left;
            margin: 0;
        }

        p {
            font-size: 10px;
            font-family: A-OTF 中ゴシックBBB Pr6N;
            font-weight: Med;
            color: #42210B;
            line-height: 17.5px;
            text-align: justify;
            margin: 0;
        }
    </style>
</head>

<body>
    <h1>青空文庫：銀河鉄道の夜　宮沢賢治</h1>
    <h2>銀河鉄道の夜</h2>
    <h3>宮沢賢治</h3>
    <h4>一、午后の授業</h4>
    <p>「ではみなさんは、そういうふうに川だと云われたり、乳の流れたあとだと云われたりしていたこのぼんやりと白いものがほんとうは何かご承知ですか。」先生は、黒板に吊つるした大きな黒い星座の図の、上から下へ白くけぶった銀河帯のようなところを指しながら、みんなに問をかけました。</p>
    <p>カムパネルラが手をあげました。それから四五人手をあげました。ジョバンニも手をあげようとして、急いでそのままやめました。たしかにあれがみんな星だと、いつか雑誌で読んだのでしたが、このごろはジョバンニはまるで毎日教室でもねむく、本を読むひまも読む本もないので、なんだかどんなこともよくわからないという気持ちがするのでした。</p>
</body>

</html>

## Illustrator2HTML_CSS.jsx
var myDoc = app.activeDocument; //ドキュメント
var mySel = myDoc.selection; //選択しているテキストフレーム
var myPara = myDoc.selection[0].paragraphs; //選択しているフレームの段落スタイル
var myParaStyle = myDoc.paragraphStyles; //ドキュメントの段落スタイル

var myHTMLArray = []; //HTMLタグ用配列
var myCSSArray = []; //CSS用配列
var myPropArray = []; //CSSプロパティ用配列
var mySizeArray = []; //サイズ用配列
var myFontFamilyArray = []; //フォントファミリー用配列
var myFontWeightArray = []; //フォントウェイト用配列
var myColorArray = []; //カラー用配列
var myLeadingArray = []; //行送り用配列
var myJustificationArray = []; //行揃え用配列

function zeroPad(myNum) { //ゼロパディング関数定義
    var myNum = ('00' + myNum).slice(-2);
    return myNum;
}

function myRound(number, n) { //四捨五入関数定義
    var myPow = Math.pow(10, n);
    return Math.round(number * myPow) / myPow;
}

for (var i = 0; i < mySel.length; i++) {
    var myCont = mySel[i].contents; //コンテンツ内容全体

    var myParaLen = mySel[i].paragraphs.length; //段落数を取得
    for (var j = 0; j < myParaLen; j++) {
        var myPraContents = mySel[i].paragraphs[j].contents; //段落ごとのコンテンツを取得
        var myParaName = mySel[i].paragraphs[j].paragraphStyles[0].name; //コンテンツごとの段落スタイル名（タグ名）を取得
        var myStartTag = "<" + myParaName + ">"; //開始タグ
        var myEndTag = "</" + myParaName + ">"; //終了タグ
        var myHTMLSentence = myStartTag + myPraContents + myEndTag; //開始タグ＋コンテンツ＋終了タグ
        myHTMLArray.push(myHTMLSentence); //配列に追加
    }
}

for (var k = 1, myParaStyleLen = myParaStyle.length; k < myParaStyleLen; k++) {
    var myDocParaStyleName = myParaStyle[k].name; //ドキュメントの段落スタイル名取得
    myCSSArray.push(myDocParaStyleName);

    var myFontSize = myParaStyle[k].size; //サイズ
    var myFontSize = "font-size: " + myRound(myFontSize, 2) + "px;"; //myFontSizeに四捨五入関数実行
    mySizeArray.push(myFontSize); //配列に追加

    var myFontFamily = myParaStyle[k].textFont.family; //フォントファミリー。※ps名が取得できない 20170102課題
    var myFontFamily = "font-family: " + myFontFamily + ";";
    myFontFamilyArray.push(myFontFamily); //配列に追加

    var myFontWeight = myParaStyle[k].textFont.style; //フォントウェイト
    var myFontWeight = "font-weight: " + myFontWeight + ";";
    myFontWeightArray.push(myFontWeight); //配列に追加

    var myColorRed = myParaStyle[k].fillColor.red.toString(16).toUpperCase(); //red値を取得（大文字のHEX値）
    var myColorRed = zeroPad(myColorRed); //ゼロパディング関数実行
    var myColorGreen = myParaStyle[k].fillColor.green.toString(16).toUpperCase(); //green値を取得（大文字のHEX値）
    var myColorGreen = zeroPad(myColorGreen); //ゼロパディング関数実行
    var myColorBlue = myParaStyle[k].fillColor.blue.toString(16).toUpperCase(); //blue値を取得（大文字のHEX値）
    var myColorBlue = zeroPad(myColorBlue); //ゼロパディング関数実行
    var myColor = "color: #" + myColorRed + myColorGreen + myColorBlue + ";"; //rgb値として取得
    myColorArray.push(myColor); //配列に追加

    var myJustification = myParaStyle[k].justification; //行揃え
    switch (myJustification) {
    case Justification.LEFT:
        myJustification = "text-align: left;";
        break;
    case Justification.CENTER:
        myJustification = "text-align: center;";
        break;
    case Justification.RIGHT:
        myJustification = "text-align: right;";
        break;
    case Justification.FULLJUSTIFYLASTLINELEFT:
        myJustification = "text-align: justify;";
        break;
    }
    myJustificationArray.push(myJustification); //配列に追加
}

var myParaStyleObj = {}; //オブジェクト生成
for (var l = 0, myParaLen = myPara.length; l < myParaLen; l++) {
    var myParaStyleName = myPara[l].paragraphStyles[0].name; //段落から段落スタイル名取得
    var myParaLeading = myPara[l].paragraphs[0].leading; //段落から行送り値取得
    myParaStyleObj.myDocParaStyleName = myParaLeading; //ドキュメントのkeyに"オブジェクトの段落スタイル名
    var myLeading = "line-height: " + myRound(myParaStyleObj.myDocParaStyleName, 2) + "px;"; //myParaStyleObj.myDocParaStyleNameに四捨五入関数実行
    myLeadingArray.push(myLeading); //配列に追加
}

for (var m = 0, myCSSArrayLen = myCSSArray.length; m < myCSSArrayLen; m++) {
    var myCSSResult = myCSSArray[m] + "{" + mySizeArray[m] + myFontFamilyArray[m] + myFontWeightArray[m] + myColorArray[m] + myLeadingArray[m] + myJustificationArray[m] + "margin: 0;" + "}"; //CSS生成
    myPropArray.push(myCSSResult); //配列に追加
}

var myHTMLArray = myHTMLArray.toString(); //HTMLタグ用配列を文字列に変換　※変数上書き
var myHTMLArray = myHTMLArray.replace(/,/g, ""); //文字列化したCSVのカンマを削除
var myPropArray = myPropArray.toString(); //CSS用配列を文字列に変換　※変数上書き
var myPropArray = myPropArray.replace(/,/g, ""); //文字列化したCSVのカンマを削除

var MyHTMLRessult = '<!DOCTYPE html><html lang="ja"><head><meta charset="UTF-8"><title>Document</title><style>' + myPropArray + '</style></head><body>' + myHTMLArray + '</body></html>'; //HTML生成

//▼ファイル保存
(function () { //無名関数を定義し実行
    var inputFileName = File.saveDialog("保存先とファイル名を指定して下さい");
    if (inputFileName == null) { //キャンセル処理
        alert("キャンセルしました。");
        return;
    }

    var inputFileName = inputFileName.toString(); //ファイル名に拡張子がないときの処理
    var myNewText = inputFileName.match(/.html/); //拡張子".txt"を付与
    if (myNewText) {
        var inputFileName = inputFileName; //入力したファイル名に拡張子が含まれる場合はそのまま
    } else {
        var inputFileName = inputFileName + ".html"; //入力したファイル名に拡張子が含まれない場合は付与
    }

    var fileObj = new File(inputFileName); //ファイル名を入力して保存
    var inputFileName = fileObj.open("w");
    if (inputFileName == true) {
        fileObj.encoding = "UTF-8"; //UTF-8を指定。これを入れないと異体字依存で書き出されない場合がある。
        fileObj.writeln(MyHTMLRessult); //書き出すテキストを連結
        fileObj.close();
        alert("処理が終わりました。");
    }
})();
	<!DOCTYPE html>
	<html lang="ja">

	<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
	h1 {
	font-size: 31px;
	font-family: A-OTF 太ゴB101 Pr6N;
	font-weight: Bold;
	color: #009245;
	line-height: 54.25px;
	text-align: center;
	margin: 0;
	}

	h2 {
	font-size: 20px;
	font-family: A-OTF 見出ゴMB31 Pr6N;
	font-weight: MB31;
	color: #006837;
	line-height: 35px;
	text-align: left;
	margin: 0;
	}

	h3 {
	font-size: 15px;
	font-family: A-OTF UD新ゴ Pr6N;
	font-weight: L;
	color: #662D91;
	line-height: 26.25px;
	text-align: right;
	margin: 0;
	}

	h4 {
	font-size: 13px;
	font-family: A-OTF 見出ミンMA31 Pr6N;
	font-weight: MA31;
	color: #0000FF;
	line-height: 22.75px;
	text-align: left;
	margin: 0;
	}

	p {
	font-size: 10px;
	font-family: A-OTF 中ゴシックBBB Pr6N;
	font-weight: Med;
	color: #42210B;
	line-height: 17.5px;
	text-align: justify;
	margin: 0;
	}
	</style>
	</head>

	<body>
	<h1>青空文庫：銀河鉄道の夜　宮沢賢治</h1>
	<h2>銀河鉄道の夜</h2>
	<h3>宮沢賢治</h3>
	<h4>一、午后の授業</h4>
	<p>「ではみなさんは、そういうふうに川だと云われたり、乳の流れたあとだと云われたりしていたこのぼんやりと白いものがほんとうは何かご承知ですか。」先生は、黒板に吊つるした大きな黒い星座の図の、上から下へ白くけぶった銀河帯のようなところを指しながら、みんなに問をかけました。</p>
	<p>カムパネルラが手をあげました。それから四五人手をあげました。ジョバンニも手をあげようとして、急いでそのままやめました。たしかにあれがみんな星だと、いつか雑誌で読んだのでしたが、このごろはジョバンニはまるで毎日教室でもねむく、本を読むひまも読む本もないので、なんだかどんなこともよくわからないという気持ちがするのでした。</p>
	</body>

	</html>
	var myDoc = app.activeDocument; //ドキュメント
	var mySel = myDoc.selection; //選択しているテキストフレーム
	var myPara = myDoc.selection[0].paragraphs; //選択しているフレームの段落スタイル
	var myParaStyle = myDoc.paragraphStyles; //ドキュメントの段落スタイル

	var myHTMLArray = []; //HTMLタグ用配列
	var myCSSArray = []; //CSS用配列
	var myPropArray = []; //CSSプロパティ用配列
	var mySizeArray = []; //サイズ用配列
	var myFontFamilyArray = []; //フォントファミリー用配列
	var myFontWeightArray = []; //フォントウェイト用配列
	var myColorArray = []; //カラー用配列
	var myLeadingArray = []; //行送り用配列
	var myJustificationArray = []; //行揃え用配列

	function zeroPad(myNum) { //ゼロパディング関数定義
	var myNum = ('00' + myNum).slice(-2);
	return myNum;
	}

	function myRound(number, n) { //四捨五入関数定義
	var myPow = Math.pow(10, n);
	return Math.round(number * myPow) / myPow;
	}

	for (var i = 0; i < mySel.length; i++) {
	var myCont = mySel[i].contents; //コンテンツ内容全体

	var myParaLen = mySel[i].paragraphs.length; //段落数を取得
	for (var j = 0; j < myParaLen; j++) {
	var myPraContents = mySel[i].paragraphs[j].contents; //段落ごとのコンテンツを取得
	var myParaName = mySel[i].paragraphs[j].paragraphStyles[0].name; //コンテンツごとの段落スタイル名（タグ名）を取得
	var myStartTag = "<" + myParaName + ">"; //開始タグ
	var myEndTag = "</" + myParaName + ">"; //終了タグ
	var myHTMLSentence = myStartTag + myPraContents + myEndTag; //開始タグ＋コンテンツ＋終了タグ
	myHTMLArray.push(myHTMLSentence); //配列に追加
	}
	}

	for (var k = 1, myParaStyleLen = myParaStyle.length; k < myParaStyleLen; k++) {
	var myDocParaStyleName = myParaStyle[k].name; //ドキュメントの段落スタイル名取得
	myCSSArray.push(myDocParaStyleName);

	var myFontSize = myParaStyle[k].size; //サイズ
	var myFontSize = "font-size: " + myRound(myFontSize, 2) + "px;"; //myFontSizeに四捨五入関数実行
	mySizeArray.push(myFontSize); //配列に追加

	var myFontFamily = myParaStyle[k].textFont.family; //フォントファミリー。※ps名が取得できない 20170102課題
	var myFontFamily = "font-family: " + myFontFamily + ";";
	myFontFamilyArray.push(myFontFamily); //配列に追加

	var myFontWeight = myParaStyle[k].textFont.style; //フォントウェイト
	var myFontWeight = "font-weight: " + myFontWeight + ";";
	myFontWeightArray.push(myFontWeight); //配列に追加

	var myColorRed = myParaStyle[k].fillColor.red.toString(16).toUpperCase(); //red値を取得（大文字のHEX値）
	var myColorRed = zeroPad(myColorRed); //ゼロパディング関数実行
	var myColorGreen = myParaStyle[k].fillColor.green.toString(16).toUpperCase(); //green値を取得（大文字のHEX値）
	var myColorGreen = zeroPad(myColorGreen); //ゼロパディング関数実行
	var myColorBlue = myParaStyle[k].fillColor.blue.toString(16).toUpperCase(); //blue値を取得（大文字のHEX値）
	var myColorBlue = zeroPad(myColorBlue); //ゼロパディング関数実行
	var myColor = "color: #" + myColorRed + myColorGreen + myColorBlue + ";"; //rgb値として取得
	myColorArray.push(myColor); //配列に追加

	var myJustification = myParaStyle[k].justification; //行揃え
	switch (myJustification) {
	case Justification.LEFT:
	myJustification = "text-align: left;";
	break;
	case Justification.CENTER:
	myJustification = "text-align: center;";
	break;
	case Justification.RIGHT:
	myJustification = "text-align: right;";
	break;
	case Justification.FULLJUSTIFYLASTLINELEFT:
	myJustification = "text-align: justify;";
	break;
	}
	myJustificationArray.push(myJustification); //配列に追加
	}

	var myParaStyleObj = {}; //オブジェクト生成
	for (var l = 0, myParaLen = myPara.length; l < myParaLen; l++) {
	var myParaStyleName = myPara[l].paragraphStyles[0].name; //段落から段落スタイル名取得
	var myParaLeading = myPara[l].paragraphs[0].leading; //段落から行送り値取得
	myParaStyleObj.myDocParaStyleName = myParaLeading; //ドキュメントのkeyに"オブジェクトの段落スタイル名
	var myLeading = "line-height: " + myRound(myParaStyleObj.myDocParaStyleName, 2) + "px;"; //myParaStyleObj.myDocParaStyleNameに四捨五入関数実行
	myLeadingArray.push(myLeading); //配列に追加
	}

	for (var m = 0, myCSSArrayLen = myCSSArray.length; m < myCSSArrayLen; m++) {
	var myCSSResult = myCSSArray[m] + "{" + mySizeArray[m] + myFontFamilyArray[m] + myFontWeightArray[m] + myColorArray[m] + myLeadingArray[m] + myJustificationArray[m] + "margin: 0;" + "}"; //CSS生成
	myPropArray.push(myCSSResult); //配列に追加
	}

	var myHTMLArray = myHTMLArray.toString(); //HTMLタグ用配列を文字列に変換　※変数上書き
	var myHTMLArray = myHTMLArray.replace(/,/g, ""); //文字列化したCSVのカンマを削除
	var myPropArray = myPropArray.toString(); //CSS用配列を文字列に変換　※変数上書き
	var myPropArray = myPropArray.replace(/,/g, ""); //文字列化したCSVのカンマを削除

	var MyHTMLRessult = '<!DOCTYPE html><html lang="ja"><head><meta charset="UTF-8"><title>Document</title><style>' + myPropArray + '</style></head><body>' + myHTMLArray + '</body></html>'; //HTML生成

	//▼ファイル保存
	(function () { //無名関数を定義し実行
	var inputFileName = File.saveDialog("保存先とファイル名を指定して下さい");
	if (inputFileName == null) { //キャンセル処理
	alert("キャンセルしました。");
	return;
	}

	var inputFileName = inputFileName.toString(); //ファイル名に拡張子がないときの処理
	var myNewText = inputFileName.match(/.html/); //拡張子".txt"を付与
	if (myNewText) {
	var inputFileName = inputFileName; //入力したファイル名に拡張子が含まれる場合はそのまま
	} else {
	var inputFileName = inputFileName + ".html"; //入力したファイル名に拡張子が含まれない場合は付与
	}

	var fileObj = new File(inputFileName); //ファイル名を入力して保存
	var inputFileName = fileObj.open("w");
	if (inputFileName == true) {
	fileObj.encoding = "UTF-8"; //UTF-8を指定。これを入れないと異体字依存で書き出されない場合がある。
	fileObj.writeln(MyHTMLRessult); //書き出すテキストを連結
	fileObj.close();
	alert("処理が終わりました。");
	}
	})();