js实现文本分段

2023-10-26

本菜鸟的第一篇博文,最近在学习js,可能有很多不严谨或者不正确的地方,欢迎指正

在.net开发中,有时候会从后台数据库拉来一大串文本,放到页面上显示。那么问题来了,大段的文本中需要分段,一般分段在后台都用转义字符\n来表示,但是我们现在要把文本放入到一个<div>当中,但是dom元素节点只有<textarea>可以识别转义字符。

我们可以通过javascript来实现这个功能,比方说我们要把这一段文字显示在网页上:

Aqeela Asifi,

who fled to Pakistan as a young woman,

has spent her life teaching other Afghan refugees.

 

它在后台作为一个string变量的值是这样:“Aqeela Asifi,\r\nwho fled to Pakistan as a young woman,\r\nhas spent her life teaching other Afghan refugees.”

通过后台c#的replace方法将转义字符替换成‘~’传到了前端页面上,具体操作这里不多说了,变成如下这样:

“Aqeela Asifi,~nwho fled to Pakistan as a young woman,~has spent her life teaching other Afghan refugees.”

现在可以用js来处理了,js处理的逻辑是根据文本中的‘~’字符来分割并将分割后的字符串前后加上<p></p>元素节点,这样就组装成html语言了,然后通过innerhtml属性添加到一

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

js实现文本分段 的相关文章

  • 图解python | 字符串及操作

    1 Python元组 Python的元组与列表类似 不同之处在于元组的元素不能修改 元组使用小括号 列表使用方括号 元组创建很简单 只需要在括号中添加元素 并使用逗号隔开即可 tup1 ByteDance ShowMeAI 1997 202
  • 通俗易懂,十分钟读懂DES,详解DES加密算法原理,DES攻击手段以及3DES原理

    文章目录 1 什么是DES 2 DES的基本概念 3 DES的加密流程 4 DES算法步骤详解 4 1 初始置换 Initial Permutation IP置换 4 2 加密轮次 4 3 F轮函数 4 3 1 拓展R到48位 4 3 2
  • 基于java的web仓库管理系统设计与实现

    基于java的web仓库管理系统设计与实现 I 引言 A 研究背景和动机 基于Java的Web仓库管理系统是近年来快速发展的领域之一 它提供了丰富的功能 如数据存储 数据检索 数据分析和数据可视化等 本文将重点介绍基于Java的Web仓库管
  • 【计算机毕业设计】微信小程序反诈科普平台

    相比于以前的传统手工管理方式 智能化的管理方式可以大幅降低反诈科普平台的运营人员成本 实现了反诈科普平台的标准化 制度化 程序化的管理 有效地防止了反诈科普平台的随意管理 提高了信息的处理速度和精确度 能够及时 准确地查询和修正反诈科普 一
  • 【计算机毕业设计】宝鸡文理学院学生成绩动态追踪系统

    研究开发宝鸡文理学院学生成绩动态追踪系统的目的是让使用者可以更方便的将人 设备和场景更立体的连接在一起 能让用户以更科幻的方式使用产品 体验高科技时代带给人们的方便 同时也能让用户体会到与以往常规产品不同的体验风格 与安卓 iOS相比较起来
  • 探索Web开发的未来——使用KendoReact服务器组件

    Kendo UI 是带有jQuery Angular React和Vue库的JavaScript UI组件的最终集合 无论选择哪种JavaScript框架 都可以快速构建高性能响应式Web应用程序 通过可自定义的UI组件 Kendo UI可
  • HTML概述、基本语法(表格整理、标签、基本结构)

    一 HTML概述 HTML指的是超文本标记语言 超文本 是指页面内可以包含图片 链接 声音 视频等内容 标记 标签 通过标记符号来告诉浏览器页面该如何显示 我们可以打开浏览器 右击页面 点击 查看网页源代码 来方便了解HTML标签通过浏览器
  • 点击存储到固定时间清除存储

    这段代码 无意间想到的 随便写了下来 运行 根据点击之后传递一个参数 将他存入本地存储 方便测试为10秒 10秒后触发下一个事件 清除本地存储 结束
  • 【gee】下载modis土地利用类型

    var china ee FeatureCollection projects assets china boundary var lc dataset ee ImageCollection MODIS 061 MCD12Q1 filter
  • Vue3 和Vue2的区别,以及钩子函数的使用

    Vue js 3 和 Vue js 2 是两个主要版本的流行前端框架 它们之间有很多区别 包括性能优化 新特性和改进的API等 以下是一些Vue 3与Vue 2之间的主要区别 以及一些示例代码来说明这些差异 1 性能优化 响应式系统 Vue
  • 数据库 | 面试官:一次到底插入多少条数据合适啊?.....面试连环炮

    数据库 面试官 一次到底插入多少条数据合适啊 面试连环炮 数据库插入操作的基础知识 插入数据是数据库操作中的基础 但是 我们程序员将面临随之而来的问题 如何快速有效地插入数据 并保持数据库 性能 当你向数据库中插入数据时 这些数据直接存储到
  • vue实现 marquee(走马灯)

    样式 代码 div class marquee prompt div class list prompt span class prompt item span div div data return listPrompt xxx xxxx
  • SpringBoot中整合MybatisPlus快速实现Mysql增删改查和条件构造器

    场景 Mybatis Plus 简称MP 是一个Mybatis的增强工具 只是在Mybatis的基础上做了增强却不做改变 MyBatis Plus支持所有Mybatis原生的特性 所以引入Mybatis Plus不会对现有的Mybatis构
  • (2024最新整理)Java最全八股文及答案!

    Java的特点 Java是一门面向对象的编程语言 面向对象和面向过程的区别参考下一个问题 Java具有平台独立性和移植性 Java有一句口号 Write once run anywhere 一次编写 到处运行 这也是Java的魅力所在 而实
  • Mysql中设置只允许指定ip能连接访问(可视化工具的方式)

    场景 Mysql中怎样设置指定ip远程访问连接 Mysql中怎样设置指定ip远程访问连接 navicat for mysql 设置只有某个ip可以远程链接 CSDN博客 前面设置root账户指定ip能连接访问是通过命令行的方式 如果通过可视
  • 2024史上最全Java面试八股文(带全部答案)

    今天要谈的主题是关于求职 求职是在每个技术人员的生涯中都要经历多次 对于我们大部分人而言 在进入自己心仪的公司之前少不了准备工作 有一份全面细致 面试题 将帮助我们减少许多麻烦 在跳槽季来临之前 特地做这个系列的文章 一方面帮助自己巩固下基
  • 【js学习之路】遍历数组api之 `filter `和 `map`的区别

    一 前言 数组是我们在项目中经常使用的数据类型 今天我们主要简述作用于遍历数组的api filter 和 map 的区别 二 filter和map的共同点 首先 我们主要阐述一下 filter 和 map 的共同点 api的参数都是回调函数
  • 获取年与年之间的所有年份

    function getYearsBetween startYear endYear var years 存放结果的数组 for var year startYear year lt endYear year years push year
  • SpringCloud Bus动态刷新全局广播

    文章目录 代码地址 配置项目 配置修改 测试 SpringCloud Bus动态刷新定点通知 代码地址 地址 https github com 13thm study springcloud tree main days11 20Bus 配
  • 如何在 Python 脚本中使用 Google OAuth2

    在使用 Python 脚本将视频上传到 YouTube 频道时 若希望将视频上传到第二个频道 需要解决 OAuth2 授权的问题 解决方案 创建新的 Google Cloud 项目 from google oauth2 import ser

随机推荐

  • 那个当年的三本学渣,为啥最后进了大厂?

    自我介绍 我是一名普通的三本大学生 自学开发 相继经历了接外包 创业 合伙人跑路等一系列事情 从一开始对于计算机的一无所知到现在拿到了一线互联网企业的special offer 磕磕碰碰 一路走来 可谓辛酸苦辣 大一小白 我就读的专业偏计算
  • ELK介绍及部署安装运用

    1 ELK简介 ELK表示 Elasticsearch Logstash Kibana 三个开源软件的缩写 是集成这三个软件于一体的日志分析及全文搜索解决方案 被广泛应用于实时日志处理 文档索引和搜索 以及数据的多维查询和统计分析等领域 数
  • 每日一题:二分答案

    二分答案 题目 Daimayuan Online Judge 首先读入 n 和 k 然后读入序列 a 接下来使用 l 和 r 表示最小值的猜测区间 由于题目中规定了最小值和元素范围 因此我们可以将上界设置为 1e18 下界设置为 1 二分查
  • 开机无法进入,chroot无法切换真实根环境

    1 开机效果图 2 关机 调整开机顺序 从光驱启动 进入挽救模式 3 尝试切换到真实根环境 失败 错误提示说 进入shell失败了 没有这个文件 4 ls查看发现这个文件是有的 但是这个文件是在挽救模式下的 真实根下面是没有的 5 真实根的
  • linux spi设备使用,linux spi驱动开发学习(一)-----spi子系统架构

    linux spi驱动开发学习 一 spi子系统架构 一 spi设备 各定义在include linux spi h structspi device structdevice dev 设备文件 structspi master maste
  • 蒙特卡洛法简述

    蒙特卡洛法简述 一 简介 1 蒙特卡洛方法又称随机模拟法 随机抽样技术 是一种随机模拟方法 蒙特卡洛法使用随机数 伪随机数 以概率和统计理论方法为基础 将所要求解的问题同一定的概率模型相互联系 用计算机实现统计模拟和抽样 以获得问题近似解的
  • LabVIEW FPGA PCIe开发讲解-实战篇:实验61:PCIe DMA+8位ADC(模拟数据采集卡)

    1 实验内容 现在很多电脑PC或者工控机主板上面都集成了PCIe插座 可以直接插入PCIe板卡 优点是卡槽标准 插拔简单 传输速度极快 对于高速采集测试测量领域 PCIe用途非常广泛 最大极限带宽可以到6 6GB s 这个速度可以直接用来做
  • Qt:依据ChatGpt生成Qt可选择扇形按钮

    目录 引言 1 生成过程 1 1 饼图 2 2 扇形图 3 3 可选择扇形按钮 1 4 新的扇形画法 GraphicItem 2 训练过程 3 错误原因 4 涉及知识点 引言 因为项目需要绘制一个中间为圆心 包含数个扇形的可选择按钮 正好C
  • php16进制转换为字符串

    因项目需求对接一个java的接口 密匙是16进制 使用php内置函数 hex2bin str abc key XXXXX res hash hmac sha1 str hex2bin key false hash hmac最后一个参数tru
  • 【Python】进阶之 MySQL入门教程

    文章目录 数据库概述 Mysql概述 Mysql安装与使用 Navicat安装和使用 Mysql终端指令操作 Mysql和python交互 订单管理案例实现 数据库概述 数据库的由来 发展历程 说明 人工管理阶段 用纸带等进行数据的存储 文
  • linux 编写防火墙脚本

    防火墙脚本实际上就是个shell脚本 使用shell脚本来设置防火墙策略的优点在于 可以预先加载一些必要的内核模块 设置环境参数 可以使用变量和灵活控制程序结构 便于脚本文件的重用和移植 常见的防火墙脚本通常包括以下部分 1 设置网段 网卡
  • 01背包和完全背包

    1 01背包 有 N 件物品和一个容量为 V 的背包 第 i 件物品的费用是 c i 价值是 w i 求解将哪些物品装入背包可使价值总和最大 这是最基础的背包问题 特点是 每种物品仅有一件 可以选择放或不放 用子问题定义状态 即 f i v
  • MD5签名 Java转换C#

    Java 代码 import java security MessageDigest import org apache commons codec binary Base64 public static String doSign Str
  • STM32系统嘀嗒定时器实现1ms中断事件

    int main 系统定时器实现周期性1000hz中断事件 即1ms SysTick Config SystemCoreClock 1000 void SysTick Handler void static uint32 t cnt
  • 算法之递归算法(五)

    上一篇将讲解的内容是从整体流程思考递归函数的内容 这一篇我们衔接上一篇继续讲解从整体流程思考递归函数的内容 我们同样使用一个实例来分析 题目描述 任何一个正整数都可以用2的幂次方表示 例如 137 27 23 20 同时约定方次用括号来表示
  • 简述JVM垃圾回收机制

    1 Java中的四种引用类型 在Java中 对于引用最基本的解释就是 如果reference类型的数据中存储的数值代表的是另外一块内存的起始地址 就称这块内存代表着一个引用 有点指针的意味 后来Java还将引用划分为了4种 根据被GC回收的
  • qt平台插件无法初始化

    报错问题 解决 Qt5 报错 This application failed to start because it could not find or load the Qt platform plugin 解决方法 利用qt自带的打包工
  • 最隐晦的程序设计指引

    一 百家争鸣 俗话说 程序员半年不学新东西 就变奥特曼 out man 过时之人 了 IT行业可以说是变化最快的行业 每年都有大量的新概念 新术语 新技术被创造出来 在多数人还在一头雾水时 更好的 替代品又被创造出来 别的不说了 单说设计方
  • git add时出现fatal: pathspec 'XXX.java' did not match any files

    后来发现是文件名出现错误 在建文件时多打了一个空格 导致不匹配 所以大家出现这个问题时很有可能时文件名写错 或者文件后缀写错或者没写
  • js实现文本分段

    本菜鸟的第一篇博文 最近在学习js 可能有很多不严谨或者不正确的地方 欢迎指正 在 net开发中 有时候会从后台数据库拉来一大串文本 放到页面上显示 那么问题来了 大段的文本中需要分段 一般分段在后台都用转义字符 n来表示 但是我们现在要把