当前位置:首页 > JavaScript

js实现截取

2026-04-06 15:36:51JavaScript

字符串截取

使用 substring()substr()slice() 方法截取字符串的一部分。

const str = "Hello, World!";
const result1 = str.substring(0, 5);  // "Hello"
const result2 = str.substr(7, 5);     // "World"
const result3 = str.slice(7, 12);     // "World"
  • substring(start, end):从 startend-1 截取。
  • substr(start, length):从 start 开始截取 length 长度的字符(已废弃,推荐 substringslice)。
  • slice(start, end):类似 substring,但支持负数索引(从末尾计算)。

数组截取

使用 slice() 方法截取数组的一部分。

js实现截取

const arr = [1, 2, 3, 4, 5];
const slicedArr = arr.slice(1, 4);  // [2, 3, 4]
  • slice(start, end):返回从 startend-1 的新数组,原数组不变。

文件内容截取

在浏览器中,可通过 FileReader 读取文件并截取部分内容。

const fileInput = document.querySelector('input[type="file"]');
fileInput.addEventListener('change', (e) => {
  const file = e.target.files[0];
  const reader = new FileReader();
  reader.onload = (event) => {
    const content = event.target.result;
    const truncated = content.substring(0, 100);  // 截取前100个字符
    console.log(truncated);
  };
  reader.readAsText(file);
});

数字截取(保留指定位数)

使用 toFixed() 或数学运算截取小数部分。

js实现截取

const num = 3.14159;
const fixedNum = num.toFixed(2);  // "3.14"(返回字符串)
const truncatedNum = Math.floor(num * 100) / 100;  // 3.14(返回数字)

URL 参数截取

通过 URLSearchParams 或字符串处理截取 URL 参数。

const url = "https://example.com?name=John&age=30";
const params = new URLSearchParams(url.split('?')[1]);
const name = params.get('name');  // "John"

正则表达式截取

使用 match()exec() 结合正则截取匹配内容。

const text = "Date: 2023-10-05";
const regex = /(\d{4}-\d{2}-\d{2})/;
const match = text.match(regex);
const date = match[1];  // "2023-10-05"

标签: js
分享给朋友:

相关文章

js实现拖拽

js实现拖拽

实现拖拽的基本步骤 通过监听鼠标事件(mousedown、mousemove、mouseup)实现拖拽功能。以下是核心代码逻辑: const draggableElement = document.…

js实现pdf在线预览

js实现pdf在线预览

使用PDF.js实现PDF在线预览 PDF.js是由Mozilla开发的一个开源JavaScript库,可以在网页中直接渲染PDF文件。以下是实现PDF在线预览的步骤: 引入PDF.js库 在HT…

js 实现分页

js 实现分页

实现分页的基本逻辑 分页功能通常需要后端返回数据总量或总页数,前端根据当前页码和每页条数截取对应数据。以下是一个基于JavaScript的简单分页实现方案: 前端分页实现 假设已有从后端获取的完整数…

js实现拷贝

js实现拷贝

实现文本拷贝 使用 document.execCommand 方法(已废弃但兼容性较好): function copyText(text) { const textarea = document…

js实现换肤

js实现换肤

使用CSS变量实现换肤 通过CSS变量可以轻松实现主题切换功能。CSS变量在根元素中定义,通过JavaScript动态修改这些变量值。 :root { --primary-color: #349…

js分组实现

js分组实现

分组实现方法 在JavaScript中,可以通过多种方式实现数组或对象的分组操作。以下是几种常见的方法: 使用Array.prototype.reduce() 通过reduce方法可以轻松实现数组分…