{"id":13394140,"url":"https://github.com/developit/undom","last_synced_at":"2025-05-16T06:05:29.213Z","repository":{"id":41262853,"uuid":"62928514","full_name":"developit/undom","owner":"developit","description":"🍩 1kb minimally viable DOM Document implementation","archived":false,"fork":false,"pushed_at":"2021-04-03T15:58:04.000Z","size":45,"stargazers_count":684,"open_issues_count":16,"forks_count":25,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-05-13T22:26:54.889Z","etag":null,"topics":["domdocument","html","html-document","polyfill","preact","serialization","shim"],"latest_commit_sha":null,"homepage":"https://npm.im/undom","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/developit.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-09T02:38:18.000Z","updated_at":"2025-05-07T12:15:09.000Z","dependencies_parsed_at":"2022-08-31T14:30:17.799Z","dependency_job_id":null,"html_url":"https://github.com/developit/undom","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/developit%2Fundom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/developit%2Fundom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/developit%2Fundom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/developit%2Fundom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/developit","download_url":"https://codeload.github.com/developit/undom/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254478187,"owners_count":22077676,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["domdocument","html","html-document","polyfill","preact","serialization","shim"],"created_at":"2024-07-30T17:01:10.242Z","updated_at":"2025-05-16T06:05:29.171Z","avatar_url":"https://github.com/developit.png","language":"JavaScript","readme":"# undom\n\n[![NPM](https://img.shields.io/npm/v/undom.svg?style=flat)](https://www.npmjs.org/package/undom)\n[![travis-ci](https://travis-ci.org/developit/undom.svg?branch=master)](https://travis-ci.org/developit/undom)\n\n### **Minimally viable DOM Document implementation**\n\n\u003e A bare-bones HTML DOM in a box. If you want the DOM but not a parser, this might be for you.\n\u003e\n\u003e `1kB`, works in Node and browsers, plugins coming soon!\n\n\n[**JSFiddle Demo:**](https://jsfiddle.net/developit/4qv3v6r3/) Rendering [preact](https://github.com/developit/preact/) components into an undom Document.\n\n[![preview](https://i.gyazo.com/7fcca9dd3e562b076293ef2cf3979d23.gif)](https://jsfiddle.net/developit/4qv3v6r3/)\n\n---\n\n\n## Project Goals\n\nUndom aims to find a sweet spot between size/performance and utility. The goal is to provide the simplest possible implementation of a DOM Document, such that libraries relying on the DOM can run in places where there isn't one available.\n\nThe intent to keep things as simple as possible means undom lacks some DOM features like HTML parsing \u0026 serialization, Web Components, etc. These features can be added through additional libraries.\n\n#### Looking to 1.0.0\n\nAs of version 1.0.0, the DOM constructors and their prototypes will be shared for all instances of a document, as is the case with [JSDOM](https://github.com/jsdom/jsdom#shared-constructors-and-prototypes). Once merged, [PR #25](https://github.com/developit/undom/pull/25) will address this by adding an `undom.env()` function, which returns a fresh document factory with a new set of constructors \u0026 prototypes.\n\n---\n\n\n## Installation\n\nVia npm:\n\n`npm install --save undom`\n\n\n---\n\n\n## Require Hook\n\nIn CommonJS environments, simply import `undom/register` to patch the global object with a singleton Document.\n\n```js\nrequire('undom/register');\n\n// now you have a DOM.\ndocument.createElement('div');\n```\n\n\n---\n\n\n## Usage\n\n```js\n// import the library:\nimport undom from 'undom';\n\nlet document = undom();\n\nlet foo = document.createElement('foo');\nfoo.appendChild(document.createTextNode('Hello, World!'));\ndocument.body.appendChild(foo);\n```\n\n\n---\n\n\n## Recipe: Serialize to HTML\n\nOne task `undom` doesn't handle for you by default is HTML serialization.  A proper implementation of this would be cumbersome to maintain and would rely heavily on getters and setters, which limits browser support.  Below is a simple recipe for serializing an `undom` Element (Document, etc) to HTML.\n\n\n#### Small \u0026 in ES2015:\n\n```js\nElement.prototype.toString = function() { return serialize(this); };\n\nfunction serialize(el) {\n  return el.nodeType==3 ? enc(el.nodeValue) : (\n    '\u003c'+this.nodeName.toLowerCase() + this.attributes.map(attr).join('') + '\u003e' +\n    this.childNodes.map(serialize).join('') + '\u003c/'+this.nodeName.toLowerCase()+'\u003e'\n  );\n}\nlet attr = a =\u003e ` ${a.name}=\"${enc(a.value)}\"`;\nlet enc = s =\u003e s.replace(/[\u0026'\"\u003c\u003e]/g, a =\u003e `\u0026#${a.codePointAt(0)};`);\n```\n\n\n#### ES3 Version\n\nThis also does pretty-printing.\n\n```js\nfunction serialize(el) {\n\tif (el.nodeType===3) return el.textContent;\n\tvar name = String(el.nodeName).toLowerCase(),\n\t\tstr = '\u003c'+name,\n\t\tc, i;\n\tfor (i=0; i\u003cel.attributes.length; i++) {\n\t\tstr += ' '+el.attributes[i].name+'=\"'+el.attributes[i].value+'\"';\n\t}\n\tstr += '\u003e';\n\tfor (i=0; i\u003cel.childNodes.length; i++) {\n\t\tc = serialize(el.childNodes[i]);\n\t\tif (c) str += '\\n\\t'+c.replace(/\\n/g,'\\n\\t');\n\t}\n\treturn str + (c?'\\n':'') + '\u003c/'+name+'\u003e';\n}\n\nfunction enc(s) {\n\treturn s.replace(/[\u0026'\"\u003c\u003e]/g, function(a){ return `\u0026#${a};` });\n}\n```\n","funding_links":[],"categories":["JavaScript",":clap: 欢迎参与​"],"sub_categories":["其他"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevelopit%2Fundom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevelopit%2Fundom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevelopit%2Fundom/lists"}