element.normalize()は、「element」に指定した要素内のテキストノードをノーマライズ（初期化）するメソッド。
空のテキストノードを削除し、隣接するテキストノードを結合することで、１つのテキストノードにまとめる。
構文
$elementNodeReference.normalize();
サンプル
テキストノード数：
１つ目のノード：
このP要素に追加：
サンプルの動作について
- 「テキストノードを追加」ボタンをクリックする度に、
- 「このP要素に追加：」の右横に「追加テキストノード」を追加する。
- IDが「sample」であるP要素内の現在のテキストノードの数を、「テキストノード数：」の右横に表示する。
- 「ノーマライズ」ボタンをクリックすると、
- P要素内の現在のテキストノード群をノーマライズし、１つにまとめる。
- IDが「sample」であるP要素内の現在の１つ目のテキストノードを、「１つ目のノード：」の右横に表示する。
- IDが「sample」であるP要素内の現在のテキストノードの数を、「テキストノード数：」の右横に表示する。
サンプルのソースコード
JavaScript
<script>
function addTextNode(){
var $textNode = document.createTextNode( " 追加テキストノード" );
var $elementNodeReference = document.getElementById( "sample" );
$elementNodeReference.appendChild($textNode);
var $outputA = document.getElementById( "uotputA" );
$outputA.innerHTML = $elementNodeReference.childNodes.length;
var $outputB = document.getElementById( "uotputB" );
$outputB.innerHTML = $elementNodeReference.childNodes[0].textContent;
}
function normalizeFunc(){
var $elementNodeReference = document.getElementById("sample");
$elementNodeReference.normalize();
var $outputA = document.getElementById( "uotputA" );
$outputA.innerHTML = $elementNodeReference.childNodes.length;
var $outputB = document.getElementById( "uotputB" );
$outputB.innerHTML = $elementNodeReference.childNodes[0].textContent;
}
</script>
function addTextNode(){
var $textNode = document.createTextNode( " 追加テキストノード" );
var $elementNodeReference = document.getElementById( "sample" );
$elementNodeReference.appendChild($textNode);
var $outputA = document.getElementById( "uotputA" );
$outputA.innerHTML = $elementNodeReference.childNodes.length;
var $outputB = document.getElementById( "uotputB" );
$outputB.innerHTML = $elementNodeReference.childNodes[0].textContent;
}
function normalizeFunc(){
var $elementNodeReference = document.getElementById("sample");
$elementNodeReference.normalize();
var $outputA = document.getElementById( "uotputA" );
$outputA.innerHTML = $elementNodeReference.childNodes.length;
var $outputB = document.getElementById( "uotputB" );
$outputB.innerHTML = $elementNodeReference.childNodes[0].textContent;
}
</script>
HTML
<p>
<button onclick="addTextNode()">テキストノードを追加</button>
<br />
テキストノード数：<span id="uotputA"></span>
</p>
<p>
<button onclick="normalizeFunc()">ノーマライズ</button>
<br />
１つ目のノード：<span id="uotputB"></span>
</p>
<p id="sample">このP要素に追加：</p>
<button onclick="addTextNode()">テキストノードを追加</button>
<br />
テキストノード数：<span id="uotputA"></span>
</p>
<p>
<button onclick="normalizeFunc()">ノーマライズ</button>
<br />
１つ目のノード：<span id="uotputB"></span>
</p>
<p id="sample">このP要素に追加：</p>