在前端开发中，我们通常需要获取网页的某些元素或者组件的唯一标识符，以便于后续的操作或者统计分析等。而 page-id 就是一款非常实用的 npm 包，可以非常便捷的获取网页元素的唯一标识符，并且支持自定义生成规则，非常实用和方便。
安装 page-id
如果你是第一次使用 page-id，需要先全局安装一下：
npm install -g page-id
获取元素的唯一标识符
在引入 page-id 之后，我们可以通过如下调用API的方式来获取元素的唯一标识符：
const pageId = require('page-id');
const element = document.querySelector('.element-class');
const id = pageId.getId(element);
console.log(id);这里的 element-class 就是我们需要获取标识符的元素的 class，可以是任何有效的 selector。注意，getId 方法只是获取元素的 id，如果元素没有 id，它会自动给元素生成一个唯一的 id。
自定义标识符生成规则
除了自动生成唯一标识符外，我们也可以通过自定义生成规则来生成标识符。这样可以更好地控制元素的唯一标识符，方便后续的管理和操作。
-- -------------------- ---- ------- ----- ------ - ------------------- -- ------------------------------- ----- ------- - ----------------------------------------- ----- ------- - - ------- --------------- -- ----- -- - --------------------- --------- ----------------
现在，元素的唯一标识符就变成了 my-unique-id-xxxxx。
除了前缀，我们还可以指定后缀、分隔符等等规则，更多细节可以查看官方文档。
结语
page-id 是一款非常实用的 npm 包，能够快速方便地获得网页元素的唯一标识符。本文介绍了 page-id 的安装和使用方法，以及如何自定义生成规则，希望对你在前端开发中处理元素唯一标识符的问题有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056bda81e8991b448e581c