缩短名称并在 html 中正确显示？

Question

我有一个网站，其中的用户使用希伯来语 (rtl) 和英语命名。

如果名字是希伯来文，点应该显示在单词的左侧，如下所示：

.אדם ל

当然是英文：

亚当·L.

当我的站点处于 ltr 模式并显示希伯来语名称时，点不在正确的位置，如果名称在 html 我应该如何缩短名称并正确显示另一种语言？

Answer 1

您可以在 css 之前和之后使用：

function changeLang(lang) {
  if (lang === 'he') {
    $('.name').addClass('rtl');
    // this is only for demonstration
    $('.name').html('אדם ל');
  } else {
    $('.name').removeClass('rtl');
    // this is only for demonstration
    $('.name').html('Mr David');
  }

}

.name::after {
  content: '.';
}
.name.rtl::before {
  content: '.';
}
.name.rtl::after {
  content: '';
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Hello <span class="name">Mr David</span>
    </h1>
<button onclick="changeLang('en')">English</button>
<button onclick="changeLang('he')">Hebrew</button>

缩短名称并在 html 中正确显示？

Shorten a name and display correctly in html?

html

multilingual

dom