<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="UTF-8">

        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

        <title>live_exam</title>

    </head>

    <body>

       <!-- <div>

           <div style="float: left;width: 200px;margin-top: 20px; height: 100px; background: red"></div>

           <div style="display: block;overflow: hidden; height: 400px; background: blue; margin-top: 50px"></div>

       </div> -->

       <div id="testId"></div>

    </body>

    <!-- <script src="./css/channel.js"></script> -->

</html>

<script type="text/javascript">

    window.onload = function(){

        var str = 'abcdefghijklmnhjkobnvcxz'

        var arr = [[2,4],[6,8],[9,11],[20,21]]

        var result = '';

        for (var i=0; i <= arr.length-1; i++) {

            console.log(arr.length-1,i)

            if (arr.length > 1) {

                if (i == 0) {

                   // console.log(1)

                    result += str.substring(0,arr[i][0]) + '<span style="color:red">' + str.substring(arr[i][0],arr[i][1] + 1) + '</span>'

                    //console.log(result)

                } else if (i >0 && i< arr.length-1) {

                    //console.log(2)

                    result += str.substring(arr[i-1][1] + 1,arr[i][0]) + '<span style="color:red">' + str.substring(arr[i][0],arr[i][1] +1) + '</span>'

                    //console.log(result)

                } else if (i == arr.length-1) {

                    //console.log(result)

                    //console.log(4)

                    result += str.substring(arr[i-1][1] + 1,arr[i][0]) + '<span style="color:red">' +str.substring(arr[i][0],arr[i][1] + 1) + '</span>' + str.substring(arr[i][1]+ 1)

                }

            } else {

                result += str.substring(0,arr[i][0]) + '<span style="color:red">' + str.substring(arr[i][0],arr[i][1] + 1) + '</span>' + str.substring(arr[i][1]+ 1)

            }

        }

        document.getElementById('testId').innerHTML = result

        //console.log(result)

    }

    var text = 'ad$$1a$$nihao$$67$$nihao$$'

        var reg = /\$\$.*?\$\$/ig;

        var arr = []

        //var reg10 = /http(s)?:/ig;

        //var  str2 = text.replace(reg,'')

        var str2 = text.replace(reg,function(exp){

            console.log('-----------')

            console.log(exp)

            arr.push(exp)

            //console.log(exp.replace(reg10,''))

            //return exp.replace(reg10,'');

        })

        console.log(arr)

</script>

　　

js实现根据文本下标位置添加特殊标识的更多相关文章

  1. js实现在光标的位置 添加内容

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. js之向div contenteditable光标位置添加字符

    js之向div contenteditable光标位置添加字符  原理: 在HTML里面,光标是一个对象,光标对象是只有当你选中某个元素的时候才会出现的. 当我们去点击一个输入框的时候,实际上它会产生 ...

  3. JS获取光标在input 或 texterea 中下标位置

    <textarea placeholder="请输入表达式" id="methodInput" ></textarea> 获取位置: v ...

  4. 2.22 JS处理富文本

    2.22 JS处理富文本 前言    <富文本>这篇解决了富文本上iframe问题,其实没什么特别之处,主要是iframe的切换,本篇讲解通过js的方法处理富文本上iframe的问题一.加 ...

  5. arcgis api 3.x for js 解决 textSymbol 文本换行显示（附源码下载）

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  6. Mysql下在某一列后即表的某一位置添加新列的sql语句

    Mysql简介 MySQL是一个开放源码的小型关联式数据库管理系统,开发者为瑞典MySQL AB公司.MySQL被广泛地应用在Internet上的中小型网站中.由于其体积小.速度快.总体拥有成本低,尤 ...

  7. js 判断一个文本框是否获得焦点

    1.js 判断一个文本框是否获得焦点 // 可以用document.activeElement判断 // document.activeElement表示当前活动的元素   // 查找你要判断的文本框 ...

  8. 给定两个字符串 s 和 t，它们只包含小写字母。 字符串 t 由字符串 s 随机重排，然后在随机位置添加一个字母。 请找出在 t 中被添加的字母。

    给定两个字符串 s 和 t,它们只包含小写字母.字符串 t 由字符串 s 随机重排,然后在随机位置添加一个字母.请找出在 t 中被添加的字母. 示例: 输入: s = "abcd" ...

  9. MongoDB "$" 字符 下标位置

    我们可以修改列表里面元素的名字 例如: 修改age=34的数据,hobby里面的"足球"改为"网球" }) { "_id" : Object ...

随机推荐

  1. Spark 学习笔记 —— 常见API

    一.RDD 的创建 1)通过 RDD 的集合数据结构,创建 RDD sc.parallelize(List(1,2,3),2) 其中第二个参数代表的是整个数据,分为 2 个 partition,默认情 ...

  2. 2017-2018-2 20172310『Java程序设计』课程 结对编程练习_四则运算_第二周

    2017-2018-2 20172310『Java程序设计』课程 结对编程练习_四则运算_第二周 博客要求 组内同学需各自发表博客 博客中需包含以下内容: 相关过程截图 关键代码解释 遇到的困难及解决 ...

  3. HttpClient异步调用引发的程序挂起问题排查及解决

    在搭建搭建分布式系统时,基础组件与框架的重要性不言而喻.但是如果组件出现bug,真的很要命.虽然我们通过各种单元测试,拼命找bug,但是总有一些问题被盲目自信蒙蔽了双眼,很多时候我们认为这段代码100 ...

  4. 线段树模板hdu 1166:敌兵布阵

    敌兵布阵 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submis ...

  5. CSS之优先级

    css的优先级 所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序. 样式表中的特殊性描述了不同规则的相对权重,它的基本规则是: 1 内联样式表的权值最高               sty ...

  6. es6学习笔记二：生成器 Generators

    今天这篇文章让我感到非常的兴奋,接下来我们将一起领略ES6中最具魔力的特性. 为什么说是“最具魔力的”?对于初学者来说,此特性与JS之前已有的特性截然不同,可能会觉得有点晦涩难懂.但是,从某种意义上来 ...

  7. CiscoIOUKeygen

    python CiscoIOUKeygen.py | grep -A 1 ‘license’ > iourc

  8. Introducing stapbpf – SystemTap’s new BPF backend

    https://developers.redhat.com/blog/2017/12/13/introducing-stapbpf-systemtaps-new-bpf-backend/

  9. iOS：UIButton扩大按钮的响应区域

    一.介绍 在开发中有时会遇见设计图里按钮设计的特别小,这时会用到手动扩大UIButton的响应范围 二.方式 下面有两个解决办法: 第一种方法:创建一个类目:UIButton+EnlargeTouch ...

  10. Selenium + WebDriver 各浏览器驱动下载地址

    Chrome 点击下载chrome的webdriver: http://chromedriver.storage.googleapis.com/index.html 不同的Chrome的版本对应的ch ...