資料結構
網路
關係資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何使用 JavaScript 設定文字是否應該被覆蓋以支援同一文件中的多種語言？
在本教程中，我們將學習如何使用JavaScript設定文字是否應該被覆蓋以支援同一文件中的多種語言。
使用 JavaScript 中的unicodeBidi屬性來設定文字是否應該被覆蓋以支援同一文件中的多種語言。將其設定為 normal、embed 或 bidi-override。bidi-override 允許您新增方向，例如從 rtl 到 ltr。
使用unicodeBidi屬性
在 JavaScript 中，unicodeBidi屬性與 direction 屬性一起使用，以設定文字是否應該被覆蓋以支援同一文件中的多種語言。此屬性是元素物件中 style 屬性的一部分。我們需要 document.getElementById() 方法來檢索元素物件。
語法
document.getElementById('element_id').style.unicodeBidi = normal | embed | bidi-override | inherit | initial
在以上語法中，我們使用 unicodeBidi 屬性以及 document.getElementById() 方法。
引數
normal − 指定沒有額外的嵌入級別。這是預設值。
embed − 指定額外的嵌入級別。
bidi-override − 根據 direction 屬性指定額外的嵌入級別。
inherit − 該屬性由其父元素繼承。
initial − 該屬性設定為預設值。
示例
在下面的示例中，我們使用 JavaScript 設定文字是否應該被覆蓋以支援同一文件中的多種語言。“setUnicodeBidi()”函式與“Set unicodeBidi”按鈕的點選事件相關聯。每當使用者點選按鈕時，該函式就會執行並設定多個元素的 unicodeBidi 屬性。
<html> <head> <style> .item { padding: 15px; margin-top: 5px; background-color: cornsilk; border: 1px solid black; direction: rtl; } </style> </head> <body> <h3> Set whether the text should be overridden to support multiple languages in the same document with JavaScript using the <i> unicodeBidi </i> property</h3> <button onclick="setUnicodeBidi()"> Set unicodeBidi </button> <div id="element1" class="item"> I Love Tutorialspoint </div> <div id="element2" class="item"> Welcome to Tutorialspoint </div> <script> // All elements const element1 = document.getElementById("element1") const element2 = document.getElementById("element2") // "Set unicodeBidi" button click event handler function function setUnicodeBidi() { element1.style.unicodeBidi = 'bidi-override' element1.style.innerHTML = 'Welcome to Tutorialspoint (unicodeBidi: bidi-override)' element2.style.unicodeBidi = 'embed' element2.style.innerHTML = 'I Love Tutorialspoint (unicodeBidi: embed)' } </script> </body> </html>
使用setProperty()方法
在 JavaScript 中，setProperty 方法在引數中獲取屬性名稱和值，並使用提供的該值為屬性設定值。例如，要設定文字是否應該被覆蓋以支援多種語言，setProperty 方法將“unicode-bidi”作為第一個引數。第二個引數，它獲取該值。此方法在元素元素的元素物件的 style 屬性中可用。
語法
document.getElementById('element_id').style.setProperty(name, value, priority)
在以上語法中，我們使用 document.getElementById() 方法返回的元素物件上的 setProperty 方法。
引數
name − 屬性的名稱。
value − 屬性值。
priority − 屬性值的優先順序（可選）。
示例
在下面的示例中，我們使用 JavaScript 和 setProperty 方法設定了文字是否應該被覆蓋以支援同一文件中的多種語言。有兩個下拉輸入欄位用於獲取使用者對 direction 屬性和 unicodeBidi 屬性的輸入。一個“Set unicodeBidi”按鈕用於在點選事件上執行“setUnicodeBidi()”函式。
<html> <body> <h3> Set whether the text should be overridden to support multiple languages in the same document with JavaScript using the <i> setProperty() </i>method </h3> <div> <label for="unicodeBidi"> Select the unicodeBidi property: </label> <select name="unicodeBidi" id="unicodeBidi"> <option value = "normal"> normal </option> <option value = "embed"> embed </option> <option value = "bidi-override"> bidi-override </option> </select> </div> <div style="margin: 5px 0px;"> <label for="direction"> Select the direction property: </label> <select name="direction" id="direction"> <option value = "ltr"> ltr </option> <option value = "rtl"> rtl </option> </select> </div> <button onclick="setUnicodeBidi()"> Set unicodeBidi </button> <div id="root" style="padding: 15px; margin-top: 5px; background-color: cornsilk; border: 1px solid black;"> Welcome to Tutorialspoint </div> <script> // "Set unicodeBidi" button click event handler function function setUnicodeBidi() { const root = document.getElementById('root') //direction input field value const direction = document.getElementById('direction').value root.style.direction = direction //unicodeBidi input field value const unicodeBidi = document.getElementById('unicodeBidi').value // using the setProperty method root.style.setProperty('unicode-bidi', unicodeBidi) } </script> </body> </html>
在本教程中，我們學習瞭如何使用 JavaScript 設定文字是否應該被覆蓋以支援同一文件中的多種語言。我們看到了使用按鈕點選事件和使用者輸入設定 unicodeBidi 屬性的兩個示例。此外，我們學習了 unicodeBidi 屬性和 setProperty 方法。使用者可以根據自己的需求遵循其中任何一種。
260 次瀏覽
