https://github.com/Innei/shuffle-article

在 DOM 上打乱文字，而非视觉上。
https://github.com/Innei/shuffle-article

Last synced: 3 months ago
JSON representation

在 DOM 上打乱文字，而非视觉上。

• Host: GitHub
• URL: https://github.com/Innei/shuffle-article
• Owner: Innei
• Created: 2021-05-11T07:31:41.000Z (about 5 years ago)
• Default Branch: master
• Last Pushed: 2023-07-11T05:35:51.000Z (almost 3 years ago)
• Last Synced: 2025-10-05T19:46:15.495Z (9 months ago)
• Language: HTML
• Homepage: https://innei.github.io/shuffle-article/
• Size: 105 KB
• Stars: 164
• Watchers: 2
• Forks: 1
• Open Issues: 4
• Metadata Files:
  • Readme: readme.md

Awesome Lists containing this project

README

          
# 逻辑打乱文字

不改变文字显示的原有顺序，而改变在 DOM 树中顺序。

![0511193628](https://cdn.jsdelivr.net/gh/Innei/img-bed@master/2021/0511193628.png)

![0512135651](https://cdn.jsdelivr.net/gh/Innei/img-bed@master/2021/0512135651.png)

Demo: 

## Why

可以有效的防止用户复制文本。即便是复制了也是乱序的，打开控制台复制依然是乱序的。

**PS：道高一尺魔高一丈，依然可以通过 OCR 等方式解决**

## Usage

```sh

yarn add article-shuffle

```

```js

import { process } from 'article-shuffle'

const $article = document.querySelector('article')

$article.innerHTML = originHTML

$article.querySelectorAll('p').forEach(($p) => {

  process($p)

})

```

MIT