テスト - ブロック要素内のURLや半角英数字の長文を改行する

動作サンプル


sample1(td要素)

samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample
samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample

sample2(未適用)

samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample

sample3(p要素)

samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample

sample4(div要素)

samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample

sample5(li要素)

sample6(p要素 テキストにbr要素が含まれている場合)

samplesamplesamplesample
samplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesamplesample
samplesample


使い方

外部ファイルとして読み込む

<script type="text/javascript" src="js/wordBreak.js"></script>

本JSを適用したい要素のクラス属性に"wordBreak"を指定する。

対象とするクラス名はJSの設定値を編集することで変更可能
<td class="wordBreak"> ~ </td>
<span class="wordBreak"> ~ </span>
<p class="wordBreak"> ~ </p>
<div><span class="wordBreak"> ~ </span></div>