给定字符串中的阿拉伯单词成一个跨度，英语单词成另一个跨度元素

Question

输入

var str = "الخدمات المصرفية الدولية ومؤسسات التمويلhgf dfsdf123456dfdfdg dfgdfg fg المصرفية الدولية ومؤسسات التمويل"

输出

<span class="redClr">الخدمات المصرفية الدولية ومؤسسات التمويل</span>hgf dfsdf123456dfdfdg dfgdfg fg <span class="redClr">المصرفية الدولية ومؤسسات التمويل</span>

Answer 1

尝试一下。

我正在检查每个字符是否为拉丁或阿拉伯语，然后将其添加到文本块中。每次字母更改时，我都会将块推送到新字符串数组中，然后重新启动新的当前块。

这不是一种有效的技术，但是可以完成工作。我认为最好只使用索引，而不是每个字符。

let body = document.getElementsByTagName("body")[0];
let string = "الخدمات المصرفية الدولية ومؤسسات التمويلhgf dfsdf123456dfdfdg dfgdfg fg المصرفية الدولية ومؤسسات التمويل";

let arabic = /[\u0600-\u06FF]/;
let newStrings = [];
let currentChunk = '';

for (let i = 0; i < string.length; i++) {
    let currentCharacter = string[i];

    let currentCharacterIsArabic = !!currentCharacter.match(arabic);
    let currentChunkIsArabic = !!currentChunk.match(arabic);

    if (currentCharacter === ' ') {
        // Current character is a space
        currentChunk += currentCharacter;
    } else if (currentCharacterIsArabic) {
        // Current character is arabic
        if (currentChunkIsArabic || currentChunk === '') {
            // Current chunk is arabic or empty
            currentChunk += currentCharacter;
        } else {
            // But current chunk is latin
            newStrings.push(currentChunk);
            currentChunk = currentCharacter;
        }
    } else {
        // Current character is latin
        if (!currentChunkIsArabic || currentChunk === '') {
            // Current chunk is latin or empty
            currentChunk += currentCharacter;
        } else {
            // But current chunk is arabic
            newStrings.push(currentChunk);
            currentChunk = currentCharacter;
        }
    }

    let currentCharacterIsTheLastCharacter = i === string.length - 1;

    if (currentCharacterIsTheLastCharacter) {
        newStrings.push(currentChunk);
    }
}

for (let i = 0; i < newStrings.length; i++) {
    let span = document.createElement("span");
    span.innerHTML = newStrings[i];
    body.appendChild(span);
}

Answer 2

var str = "الخدمات المصرفية الدولية ومؤسسات التمويل hgf dfsdf123456dfdfdg dfgdfg fg المصرفية الدولية ومؤسسات التمويل";

var splittedString = str.split(" ");
var arabicPattern = /[\u0600-\u06FF]/;
var arabicKeywords = "";
var englishKeywords = "";

		for(var i=0; i<splittedString.length; i++){
    	if(arabicPattern.test(splittedString[i])){
      	arabicKeywords = arabicKeywords+ " " +splittedString[i];
      } else {
      	englishKeywords = englishKeywords+ " " +splittedString[i];
      }  
    }
    
    document.getElementById("Arabic").innerHTML = arabicKeywords;
    
    document.getElementById("English").innerHTML = englishKeywords;
    

<div>
<span style="background-color:#b3f297" id="Arabic"/>
</div>

<div>
<span style="background-color:#00ffff" id="English"/>
</div>