如何在语言选择时将所有div元素dir从LTR更改为RTL？

Question

根据语言选择更改所有div元素的最佳方法是什么？

我的方案 - 用英语查看网页，然后更改为从右到左的类型语言，

我想动态添加dir =“rtl”并将其删除或在选择从左到右类型语言时将其更改为dir =“ltr”。

例如

<div dir="ltr">

Answer 1

使用下拉列表并附加更改事件处理程序。在处理程序回调中更新属性值。

使用JQUERY：

＆＃13;

＆＃13;

$('#type').change(function() {
  $('#div').attr('dir', this.value)
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="div" dir="ltr"></div>

<select id="type">
  <option value="ltl">left</option>
  <option value="rtl">right</option>
</select>

＆＃13;

＆＃13;

＆＃13;

使用Pure JS：

＆＃13;

＆＃13;

document.getElementById('type').addEventListener('change', function() {
  document.getElementById('div').setAttribute('dir', this.value)
})

＆＃13;

<div id="div" dir="ltr"></div>

<select id="type">
  <option value="ltl">left</option>
  <option value="rtl">right</option>
</select>

＆＃13;

＆＃13;

＆＃13;