style.unicodeBidiは、要素のスタイル属性のunicode-bidiプロパティの値を取得、もしくは、設定するプロパティ。
unicode-bidiプロパティは、テキストの方向を指定することができる。
構文
取得
var $unicodeBidi = $elementReference.style.unicodeBidi;
戻り値
要素のスタイル属性のunicodeBidiプロパティの値。
設定
$elementReference.style.unicodeBidi = "normal | embed | bidi-override | inherit";
- normal | embed | bidi-override | inherit
- 下記の何れかの値を指定する。初期設定値は、「normal」。
- normal：Unicodeによる各言語の書式の方向に従う。
- embed：Unicodeによる各言語の書式に、style.directionプロパティに指定した値を埋め込む。文字の並び方は変わらない。
- bidi-override：Unicodeによる各言語の書式を、style.directionプロパティに指定した値で上書きする。文字の並び方も変わる。
- inherit：親要素の設定を継承。
サンプル
direction：
サンプル要素のdirectionプロパティの値：
unicodeBidi：
サンプル要素のunicode-bidiプロパティの値：
サンプル要素
サンプルの動作について
- 「direction：」の右横のボタンをクリックすると、「directionプロパティ」の値をボタン名のテキストに設定する。設定値を、「サンプル要素のdirectionプロパティの値：」の右横に表示する。
- 「unicodeBidi：」の右横のボタンをクリックすると、「unicode-bidiプロパティ」の値をボタン名のテキストに設定する。設定値を、「サンプル要素のunicode-bidiプロパティの値：」の右横に表示する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
function setDirection( $direction ) {
var $element = document.getElementById( "sample" );
$element.style.direction = $direction;
var $direction = $element.style.direction;
document.getElementById( "sampleOutputDirection" ).innerHTML = $direction;
}
function setUnicodeBidi( $unicodeBidi ) {
var $element = document.getElementById( "sample" );
$element.style.unicodeBidi = $unicodeBidi;
var $unicodeBidi = $element.style.unicodeBidi;
document.getElementById( "sampleOutputUnicodeBidi" ).innerHTML = $unicodeBidi;
}
</script>
function setDirection( $direction ) {
var $element = document.getElementById( "sample" );
$element.style.direction = $direction;
var $direction = $element.style.direction;
document.getElementById( "sampleOutputDirection" ).innerHTML = $direction;
}
function setUnicodeBidi( $unicodeBidi ) {
var $element = document.getElementById( "sample" );
$element.style.unicodeBidi = $unicodeBidi;
var $unicodeBidi = $element.style.unicodeBidi;
document.getElementById( "sampleOutputUnicodeBidi" ).innerHTML = $unicodeBidi;
}
</script>
HTML
<p>direction：
<button onclick="setDirection('ltr');">ltr</button>
<button onclick="setDirection('rtl');">rtl</button>
<button onclick="setDirection('inherit');">inherit</button>
</p>
<p>サンプル要素のdirectionプロパティの値：<span id="sampleOutputDirection"></span></p>
<p>unicodeBidi：
<button onclick="setUnicodeBidi('normal');">normal</button>
<button onclick="setUnicodeBidi('embed');">embed</button>
<button onclick="setUnicodeBidi('bidi-override');">bidi-override</button>
<button onclick="setUnicodeBidi('inherit');">inherit</button>
</p>
<p>サンプル要素のunicode-bidiプロパティの値：<span id="sampleOutputUnicodeBidi"></span></p>
<div id="sample" style="padding: 10px; border: 1px solid red; background-color: yellow;">
サンプル要素
</div>
<button onclick="setDirection('ltr');">ltr</button>
<button onclick="setDirection('rtl');">rtl</button>
<button onclick="setDirection('inherit');">inherit</button>
</p>
<p>サンプル要素のdirectionプロパティの値：<span id="sampleOutputDirection"></span></p>
<p>unicodeBidi：
<button onclick="setUnicodeBidi('normal');">normal</button>
<button onclick="setUnicodeBidi('embed');">embed</button>
<button onclick="setUnicodeBidi('bidi-override');">bidi-override</button>
<button onclick="setUnicodeBidi('inherit');">inherit</button>
</p>
<p>サンプル要素のunicode-bidiプロパティの値：<span id="sampleOutputUnicodeBidi"></span></p>
<div id="sample" style="padding: 10px; border: 1px solid red; background-color: yellow;">
サンプル要素
</div>