<!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. mysql查询根据时间排序

    表数据: mysql查询根据时间排序,如果有相同时间则只查询出来一个 所以需要再判断,如果时间相同,则根据id进行降序排序

  2. 英语口语练习系列-C25-冒险-课堂用语-葬我

    词汇-冒险 adventure noun [ C or U ] UK /ədˈven.tʃər/ US /ədˈven.tʃɚ/ an unusual, exciting, and possibly ...

  3. 产品开发- DFX

    一.DFE(Design for Environment)面向环境的设计 二.DFM(Design for Manufacture)面向制造的设计 DFM的最终设计的主要目的是对产品成本的控制,主要包 ...

  4. 理解Hadoop脚本hadoop-2.5.0/bin/hadoop

    1 #!/usr/bin/env bash    此处为什么不是  #!/bin/bash  ? 考虑到程序的可移植性,env的作用就是为了找到正确的脚本解释器(这里就是bash),在不同的Linux ...

  5. select超全超详细总结篇

    1.经常使用到select,每次都是翻翻翻资料,干脆总结一下,方便日后查看.   2.checked     匹配所有选中的被选中元素(复选框.单选框等,不包括select中的option)   se ...

  6. sweetalert的使用

    1.swal()方法中的参数: 2.引入css与js,通过cdn加速服务 <link href="https://cdnjs.cloudflare.com/ajax/libs/swee ...

  7. oracle增删改字段

    添加字段的语法:alter table tablename add (column datatype [default value][null/not null],….); 修改字段的语法:alter ...

  8. css冲刺

    CSS知识点及面试题 1.一般与文本相关的属性都可以继承text-/font-/line- 2.background属性1)background-repeat:repeat/repeat-x/repe ...

  9. 29、粘包现象（struct模块）

    昨天我们所做的套接字是有漏洞的,它会出现粘包现象,没有发现这个问题的我们今天会进行演示.今天也会稍微讲解一下基于udp的套接字. 本篇导航: 基于udp的套接字 粘包现象 粘包 解决粘包方法 stru ...

  10. 开源流媒体服务器SRS学习笔记(2) - rtmp / http-flv / hls 协议配置 及跨域问题

    对rtmp/http-flv/hls这三种协议不熟悉的同学,强烈建议先看看网友写的这篇文章科普下:理解RTMP.HttpFlv和HLS的正确姿势 .   srs可以同时支持这3种协议,只要修改conf ...