数据结构
网络
关系数据库管理系统
操作系统
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 次浏览
