js 字符串根據下標索引實現高亮顯示

效果圖

實現代碼

• 方式1 - 轉數組

<script>
    var str = `我們於前述時間更新了《愛奇藝隱私政策》的相關內容。本次更新的內容主要包括： 依照最新法律要求更加詳細地介紹了我們對兒童個人信息的保護規則並據此增加了附件一《愛奇藝兒童個人信息保護規則》、增加了身份認證功能下我們對身份認證信息的收集和使用情況以及其他文案描述性內容調整等。 請您在使用/繼續使用愛奇藝集團的產品與/或服務前仔細閱讀和充分理解全文，並在同意全部內容後使用/繼續使用。`
    var list = [
        ["NUM", 76, 77],
        ["ORG", 146, 151],
        ["NUM", 176, 178]
    ]
    var strList = str.split("")
    for (var i = 0; i < list.length; i++) {
        var [type, startNum, endNum] = list[i]
        if (type == "NUM") {
            if (startNum == endNum - 1) {
                strList[startNum] = `<span style="color:blue;">${str[startNum]}</span>`
            } else {
                strList[startNum] = `<span style="color:blue;">${str[startNum]}`
                strList[endNum - 1] = `${str[endNum-1]}</span>`
            }

        }
    }
    document.write(strList.join(""))
</script>

• 方式2 - 字符串截取

<script>
	var str = `我們於前述時間更新了《愛奇藝隱私政策》的相關內容。本次更新的內容主要包括： 依照最新法律要求更加詳細地介紹了我們對兒童個人信息的保護規則並據此增加了附件一《愛奇藝兒童個人信息保護規則》、增加了身份認證功能下我們對身份認證信息的收集和使用情況以及其他文案描述性內容調整等。 請您在使用/繼續使用愛奇藝集團的產品與/或服務前仔細閱讀和充分理解全文，並在同意全部內容後使用/繼續使用。`
    var list = [
        ["NUM", 76, 77],
        ["ORG", 146, 151],
        ["NUM", 176, 178]
    ]
    for (var i = list.length - 1; i >= 0; i--) {
        var [type, startNum, endNum] = list[i]
        if (type == "NUM") {
            str = str.substring(0, startNum) + '<i style="color:blue">' + str.substring(startNum, endNum) + '</i>' + str.substring(endNum)
        }
    }
    document.write(str)
</script>