findAndReplaceDOMText

开源

:mag: 查找并替换 DOM 文本

791 stars0 点赞0 次浏览

工具介绍

:mag: 查找并替换 DOM 文本

查看演示 findAndReplaceDOMText 会在指定的 DOM 节点中搜索正则表达式匹配,并用您指定的节点或文本替换或包裹每个匹配项。例如:

xml


  123 456 Hello

javascript

findAndReplaceDOMText(document.getElementById('t'), {
  find: /Hello/,
  wrap: 'em'
});

这将导致:

xml


  123 456 Hello

而且当匹配分布在多个节点时也会起作用! 例如

xml


  123 456 Hello Goodbye

javascript

findAndReplaceDOMText(document.getElementById('t'), {
  find: /Hello/,
  wrap: 'em'
});

这将导致:

xml


  123 456 Hello Goodbye

EM 元素已被添加两次,以覆盖匹配的两部分。

获取最新的 findAndReplaceDOMText.js (或 npm install findandreplacedomtext) 并将其包含在您的页面中作为一个 ``。

findAndReplaceDOMText 具有以下参数签名:

find(RegExp | String): 要搜索的内容。字符串默认会进行全局搜索（查找所有匹配），而 RegExp 只会这样做，如果您包含全局标志(/.../g）。 * replace 可选(String | Function): 要用来替换匹配的文本字符串，或是一个函数，该函数应该返回替换的 Node 或字符串。如果您使用字符串，它可以包含各种标记： * $n 用于表示正则表达式的第 n 个捕获组（即 $1、$2 …） * $0 或 $& 用于表示整个匹配 * $ 用于表示匹配的左侧的所有内容 * $' 用于表示匹配的右侧的所有内容 * wrap 可选(String | Node): 表示将匹配包裹在内的元素节点名的字符串（例如 span 或 em）。或者是一个 Node（即模板节点），我们将对其进行克隆