ジェネレーター的に入力したテキストを変換してajaxで出力する。simplehtmldomで整形。

#実現したい動き
テキストにテキストを入力してサブミットボタンを押すと、整形をして出力してくれる。
htmlタグからcolspanとrowspan以外の不必要な属性を削除して出力する

その際整形には、簡単なものはpreg_replaceを使って置換。
今回の場合はそれだけでは難しいのでsimplehtmldomを使用。



インデックス画面が基本の画面になる場合。
以下の場合では<i class="fa fa-arrow-circle-o-down"></i>(``<i class="fa fa-arrow-circle-o-down" aria-hidden="true"></i>``)をクリックした時にjsが動き出します。

#全コード
                       
```php:index.php

<html>
    <head>
        <title>SAMPLE CONVERTER</title>
		<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
		<script src="script.js"></script>
    </head>

    <body>
		<div class="wrapper">
			<h1>TABLE CONVERTER</h1>
			<main>
				<div class="container">
					<form action="">
						<div class="row">
							<div class="col-sm-12">
								<textarea class="form-control" rows="20" id="before"></textarea>
							</div>
						</div>
						<div class="row">
							<div class="col-sm-offset-5 col-sm-1">
								<i class="fa fa-arrow-circle-o-down" aria-hidden="true"  style="font-size: 30px"></i>
							</div>
						</div>
						<div id ="add_table"></div>
					</form>
				</div>
			</main>
		</div>

		<footer>

		</footer>
    </body>
</html>

```
```js:script.js
$(function () {
	$(document).on('click', "i", function () {
		var _val = $('#before').val();
		var _this = $(this);
		$.ajax({
			type: "POST",
			url: 'convert.php',
			data: {
				type: _val
			},
			dataType: "json"
		}).then(function (json) {

			$('#add_row').remove();
			$('#add_table').append(json.html);
		}, function (a, b) {//
			alert(b);
		});

	});
});
```

```php:convert.php
<?php
$text = $_POST['type'];
require_once 'simple_html_dom.php';

$text = preg_replace("/(<style>.*?<\/style>)/mis", "", $text);
$text = preg_replace("/(<col.*?>)/is", "", $text);
$text = preg_replace("/<span.*?>(.*?)<\/span>/mis", "$1", $text);
$text = preg_replace("/<p.*?>(.*?)<\/p>/mis", "$1", $text);
$text = preg_replace("/<font.*?>(.*?)<\/font>/mis", "$1", $text);
$text = preg_replace("/<ruby>(.*?)<\/ruby>/mis", "$1", $text);
$text = preg_replace("/<rt>(.*?)<\/rt>/mis", "$1", $text);
$text = preg_replace('/(\t|\r\n|\r|\n)/s', '', $text);

$text = preg_replace("/<!\[if supportMisalignedColumns\]>(.*?)<!\[endif\]>/mis", "", $text);

$html = str_get_html($text);

$table = $html->find('table');
$td = $html->find('td');
$tr = $html->find('tr');


foreach ($table as $value) {
	$attrs = $value->getAllAttributes();
	foreach ($attrs as $key => $val) {
		$value->removeAttribute($key);
	}
}
foreach ($tr as $value) {
	$attrs = $value->getAllAttributes();
	foreach ($attrs as $key => $val) {
		$value->removeAttribute($key);
	}
}


foreach ($td as $value) {
	$attrs = $value->getAllAttributes();
	foreach ($attrs as $key => $val) {
		if ($key != 'colspan' && $key != 'rowspan') {
			$value->removeAttribute($key);
		}
	}
}

$body = $html->save();


$body = "<div class='table_frame table_fontsize_s'> " . $body . "</div>";
$html->clear();
ob_start();
?>

<div id ="add_row"class="row">
	<div class="col-sm-12">
		<textarea class="form-control" rows="20" id="before">
			<?= $body ?>
		</textarea>
	</div>
</div>


<?php
$html = ob_get_clean();
$json = array(
	'html' => $html,
);
echo json_encode($json);

```
#詳細
``<div id ="add_table"></div>``JSで吐き出す時にここの中に吐き出す。
見た目的には汚いのでAFTERとかにした方がソースは綺麗になるかも。

``var _this``は使わなかったから余計だったな。。
``#before``にテキストボックスに入力したテキストを格納。
POSTで``convert.php``にdata.typeの値を渡して``$text = $_POST['type'];``で受け取る。``preg_replace``などで整形。

#ここが重要
simple_html_dom.phpを読み込む。
tableとtrは単純に全ての属性を消去しただけなので割愛。
tdにcolspanとrowspanがあるので
``getAllAttributes()``・・・全ての属性を配列で返す
``removeAttribute()``・・・指定の属性を消去する
この2つを使う。

```php
foreach ($td as $value) {
    $attrs = $value->getAllAttributes();
    foreach ($attrs as $key => $val) {
        if ($key != 'colspan' && $key != 'rowspan') {
            $value->removeAttribute($key);
        }
    }
}
```
getAllAttributesで取得した配列には**属性名=>値**で格納されるので、
foreachで回して
「もし$keyがcolspanじゃなければ、その属性はremoveAttribute（消去）」としたらOK。

#値を渡す
```php
<?php

～省略～

$body = $html->save();


$body = "<div class='table_frame table_fontsize_s'> " . $body . "</div>";
$html->clear();
ob_start();
?>

～html省略～

<?php
$html = ob_get_clean();
$json = array(
    'html' => $html,
);
echo json_encode($json);
?>
```
#jsで受け取る
json.htmlで出力してあげればOK
```js
 $('#add_table').append(json.html);
```