# @cocreate/element-prototype 中文文档 规范地址：https://npmcn.com/package/%40cocreate/element-prototype/ 版本：2\.0\.2 npm 元数据更新时间：2026-11-07T02:44:05.311Z 中文译文更新时间：2026-11-10T05:26:28.511Z 软件包许可：AGPL-3\.0 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40cocreate/element-prototype 原文对照：https://npmcn.com/package/%40cocreate/element-prototype/?lang=original 项目主页：https://cocreatejs.com/docs/element-prototype 源码仓库：https://github.com/CoCreateJS/element-prototype ## 关键信息（来自 npm 元数据） - 包体积（解压后）：195 kB，22 个文件 - 模块格式：CommonJS - TypeScript 类型：未声明 - 运行依赖：1 个 - 首次发布：2022-10-29T15:57:09.319Z - 最新版本发布：2026-11-07T02:44:05.139Z - 近 30 天下载量：3163（2026-10-10 至 2026-11-08，npm 官方下载统计） - 已发布版本数：165（近 12 个月 14 个） ## 中文简介 香草javascript中简单的元素原型组件. 使用 HTML5 数据属性和/或 JavaScript API 进行轻松配置. ## 安装 ```sh npm install @cocreate/element-prototype ``` 也可以使用：`pnpm add @cocreate/element-prototype`、`yarn add @cocreate/element-prototype`、`bun add @cocreate/element-prototype` ## README # 创造元素-原型 香草javascript中简单的元素原型组件. 使用 HTML5 数据属性和/或 JavaScript API 进行轻松配置. 把它当作我们的旋转 [游乐场!](https://cocreatejs.com/docs/element-prototype) ![min file size in bytes](https://img.badgesize.io/https://cdn.CoCreateJS.com/element-prototype/latest/CoCreate-element-prototype.min.js?style=flat-square&label=minified&color=orange) ![gzip file size in bytes](https://img.badgesize.io/https://cdn.CoCreateJS.com/element-prototype/latest/CoCreate-element-prototype.min.js?compression=gzip&style=flat-square&label=gzip&color=yellow) ![brotlifile size in bytes](https://img.badgesize.io/https://cdn.CoCreateJS.com/element-prototype/latest/CoCreate-element-prototype.min.js?compression=brotli&style=flat-square&label=brotli) ![GitHub latest release](https://img.shields.io/github/v/release/CoCreateJS/element-prototype?style=flat-square) ![GitHub](https://img.shields.io/github/license/CoCreateJS/element-prototype?style=flat-square) ![GitHub](https://img.shields.io/static/v1?style=flat-square&label=&message=Hiring&color=blueviolet) ![CoCreate-element-prototype](https://cdn.cocreatejs.com/docs/CoCreate-element-prototype.gif) ## [文档和演示](https://cocreatejs.com/docs/element-prototype) 完整的指南和工作演示请参见 [贴花](https://cocreatejs.com/docs/element-prototype) ## 通用元素值 关于通用要素,包括可满足要素, `getValue()` 财务报告和审定财务报表 `getValueAsync()` 选择 `value` 属性,然后是 `.value` 属性 当它存在时,最后 `innerHTML`空属性或财产 空值; 它不会掉入已提供的内容. 明确的 DOM 读取类型绕过两个存储值 : `get-value-type="text"` 或者说 `"innerText"` 读取可见文本, `"textContent"` 读取文本内容, `"innerHTML"` 读取内部标记,和 `"outerHTML"`, (中文(简体) ), `"element"`,或 `"node"` 读取外加标记. `value-type` 在范围缩小时提供相同的选项 `get-value-type` 未指定。 转换类型,例如 `boolean` 财务报告和审定财务报表 `json` 保留正常值优先,然后转换所选值. DOM 读取仍然支持 `get-value-remove-query` 过滤中. 原型方法也接受一个明确的类型参数,例如: `element.getValue("textContent")` 或者说 `element.getValueAsync("innerHTML")`。 。 。 . 程序上声称的编辑器主机甚至在它们之前就使用属性存储 初始同步读取完成 . 非本土因素 `component`, (中文(简体) ), `editor`,或启用 `contenteditable` 属性 单独存储输入值 `.value` 设置转换后的属性 转换,然后发送 所配置的事件。 此分支不写入 `value` 属性或替换 DOM直接满足. 一个已有的属性设置器, 如编辑器的源设置器, 仍然运行时 `.value` 指定。 通用元素可以保留结构化 没有 JSON 序列化的对象和阵列。 输入、文本区和选择 即使带有这些标记属性,也遵循他们的本土地道. 框架的使用 标记时他们的专用设置路径 `editor`时 明确 `component` 标记仍然选择一个iframe入到属性存储中; 因此,复选框、无线电、选择、密码和日期处理仍然适用. `crdt="true"` 不再禁用 share- setter 本地任务; 文件输入 仍被排除在普通价值转让之外. 共享获取器直接返回这些存储的组件/编辑值,而不包含 消耗他们。 在编辑有 `.value` 属性,它仍然使用 用于支持初始化的现有元素特定或通用倒计时. 组件/编辑/内容可读取绕过以上通用优先和转换, 如组件存储之前所做的。 保留原地和框架处理 当此组件/编辑分支不适用时, 它们的专用路径。 元素 组件提供的方法可能绕过此共享处理器。 编辑器保存 这些共享方法并消耗其投入通知。 已生成 `input` 财务报告和审定财务报表 `change` 活动包括: `event.detail.value`, (中文(简体) ), 与现有 `skip` 旗; 只有源通知可以省略该值. 这样可以让 iframe 适配器在不指定的情况下接收完整重置源 `src` 或者说 `srcdoc` 自己来 在iframe 存在存储值之前, 共享获取器 读它 `srcdoc` 属性或序列化其可访问当前文档. 不使用单独的组件值存储 . ## 价值转变 值转换接受三个属性命名空间: - `value-*` 适用于阅读和写作. - `get-value-*` 适用于 `getValue()` 财务报告和审定财务报表 `getValueAsync()`。 。 。 . - `set-value-*` 适用于 `setValue()`。 。 。 . 每个特定方向的属性都凌驾于它相应的共享属性之上, 不论属性顺序。 其他选项仍然独立地退后. 譬如说, `value-uppercase` 与 `set-value-uppercase="false"` 大写 只有阅读。 空域正则/编码属性会禁用该操作; `"false"` 还禁用大小写、正则ex和编码/解码转换. 一个空大小写属性可以实现大小写转换. 支持的转换后缀包括: `lowercase`, (中文(简体) ), `uppercase`, (中文(简体) ), `replace`, (中文(简体) ), `replaceall`, (中文(简体) ), `replacement`, (中文(简体) ), `test`, (中文(简体) ), `match`, (中文(简体) ), `split`, (中文(简体) ), `lastindex`, (中文(简体) ), `search`, (中文(简体) ), `exec`, (中文(简体) ), `encode`,以及 `decode`编辑 `type` 后缀支持 `boolean`, (中文(简体) ), `object`, (中文(简体) ), `json`, (中文(简体) ), `array`, (中文(简体) ), `array.$keys`, (中文(简体) ), `array.$values`,以及 `array.$entries`,以及 现有元素读取/提交类型. `prefix` 财务报告和审定财务报表 `suffix` 也荣誉范围 覆盖, 保留其现有的添加读取和条写行为 . 结构转换按此顺序运行: 大小写、 regex 操作( 有效) 属性顺序),编码,解码,以及类型转换. 他们以前跑过 组件存储或元素渲染。 组成部分保留结构价值; 文本区域将对象和阵列序列化为JSON. ```html
``` 通话 `setValue('{"enabled":true}')` 上方组件存储对象; 联合国 `getValue()` 返回该对象。 转换使用范围属性 这只应该发生一次: 无扫描的替换或编码可以再次运行 当读取先前所写的值时. ## 光盘N ```html ``` ```html ``` ## 国家预防机制 ```shell $ npm i @cocreate/element-prototype ``` ## 线条 ```shell $ yarn install @cocreate/element-prototype ``` # 目录 - [目录](https://npmcn.com/package/%40cocreate/element-prototype/#readme-table-of-contents) - [通知](https://npmcn.com/package/%40cocreate/element-prototype/#readme-announcements) - [路线图](https://npmcn.com/package/%40cocreate/element-prototype/#readme-roadmap) - [如何贡献](https://npmcn.com/package/%40cocreate/element-prototype/#readme-how-to-contribute) - [关于](https://npmcn.com/package/%40cocreate/element-prototype/#readme-about) - [许可证](https://npmcn.com/package/%40cocreate/element-prototype/#readme-license) # 通知 图书馆的所有更新都记录在我们 [变化](https://github.com/CoCreateJS/element-prototype/blob/master/CHANGELOG.md) 财务报告和审定财务报表 [释放](https://github.com/CoCreateJS/element-prototype/releases)。您也可以订阅电子邮件以发布和中断更改. # 路线图 如果你对这个项目的未来方向有兴趣, 请看看我们的开放 [问题](https://github.com/CoCreateJS/element-prototype/issues) 财务报告和审定财务报表 [拖动请求](https://github.com/CoCreateJS/element-prototype/pulls)我们想听听你的反馈. # 关于 CoCreate-element-prototype由CoCreate开发者经验团队提供指导和支持. 请发电子邮件给开发者体验团队 [这里](mailto:develop@CoCreateJS.com) 如果有任何疑问. CoCreate-element-prototype由CoCreate维护和资助. CoCreate的名称和标志是CoCreate,LLC的商标. # 如何贡献 我们鼓励为我们的图书馆捐款(你甚至可能得分) [捐款](https://github.com/CoCreateJS/element-prototype/blob/master/CONTRIBUTING.md) 详细指南. 我们希望这个图书馆由社区驱动, Coreate 领导。 我们需要你的帮助来实现这一目标。 为了帮助确保我们按正确的顺序建造正确的东西,我们请你们创造 [问题](https://github.com/CoCreateJS/element-prototype/issues) 财务报告和审定财务报表 [拖动请求](https://github.com/CoCreateJS/element-prototype/pulls) 或只是对现有问题进行投票或发表意见或提出请求. 我们感谢你的继续支持,谢谢! # 许可证 该软件在GNU Affero通用公共许可证版本3(AGPLv3)和商业许可证下获得双许可证. - **开源使用**:用于开源项目和非商业用途,此软件可在AGPLv3下提供. AGPLv3允许您自由使用,修改并分发此软件,前提是所有修改和衍生作品也根据AGPLv3获得许可. 营业执照全文见 [自由文件](https://github.com/CoCreateJS/element-prototype/blob/master/LICENSE)。 。 。 . - **商业用途**: 意图将这一软件用于商业目的的营利性公司和个人必须获得商业许可证。 商业执照,当你签到 API 密钥我们 [网站](https://cocreatejs.com/)。该许可证允许对软件进行专有使用和修改,而不需要AGPLv3的左取要求。 将这一软件融入专有商业产品和应用是理想的. 如果您没有购买商业许可证,并打算将这个软件用于商业目的,请到我们的网站上注册API密钥. ### 选定选项的值 通过相应的同步选择每个选项的获取器 或同步值获取器,然后应用选择的自身转换. 单选返回一个处理过的值; `multiple` 返回数组. ```html ``` 这里的值是 `""`, (中文(简体) ), `true`,以及 `false`申报的类型和转换 选项只影响这些选项。 现有选择级别类型仍然适用 ; 选择级别前缀和后缀仍然适用于每个 多个选择中的值。 如果没有选择选项,结果就是 `""` (单位:千美元) 单项选择或 `[]` 用于多个选择,在选定级别转换之前. ## 常见问题 ### @cocreate/element-prototype 是什么？ 香草javascript中简单的元素原型组件\. 使用 HTML5 数据属性和/或 JavaScript API 进行轻松配置\. ### 如何安装 @cocreate/element-prototype？ 在项目目录运行 npm install @cocreate/element-prototype，或使用 pnpm add / yarn add / bun add。 ### @cocreate/element-prototype 支持 TypeScript 吗？ 该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/cocreate\_\_element-prototype 是否存在。 ### @cocreate/element-prototype 支持 ESM 还是 CommonJS？ 以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。 ### @cocreate/element-prototype 可以商用吗？ @cocreate/element-prototype 使用 AGPL-3\.0 许可。最严格的 Copyleft：除分发外，通过网络向用户提供基于它的服务也需要开源对应源码。闭源 SaaS 使用前务必评估。以上为概括，不构成法律意见，请以许可原文为准。 ### @cocreate/element-prototype 的下载量有多少？ 根据 npm 官方下载统计，@cocreate/element-prototype 在 2026/10/10 – 2026/11/08 这 30 天内被下载 3,163 次，日均约 105 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @cocreate/element-prototype 还在维护吗？ 最新版本 2\.0\.2 发布于 2026/11/07（3 天前）；至今共发布 165 个版本，其中过去 12 个月发布了 14 个；首次发布于 2022/10/29。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。