浏览器自定义命名空间元素处理器

Browser custom namespaced element processors

本文关键字：处理器 元素 命名空间 自定义 浏览器      更新时间：2023-09-26

在浏览器环境中，以这种方式
创建 svg 元素
svg = document.createElement('svg');将其附加到正文并使用 SVG 元素填充不起作用，因为

svg.namespaceURI === 'http://www.w3.org/1999/xhtml'但这样做

svg = document.createElementNS('http://www.w3.org/2000/svg','svg')它会起作用。
这是合理的，因为该元素应该以 svg 方式而不是 html 方式
处理同样，创建

select = document.createElementNS('xxxx','select')并附加到 body，该元素不会显示为众所周知的select下拉列表，因为浏览器被告知它不是http://www.w3.org/1999/xhtml:select元素，而是xxxx:select。
似乎节点处理被调度到不同的处理器，具体取决于节点本身的 NS（识别时）。
是否可以为文档定义自定义命名空间URI，以便允许其具有该特定nsURI的节点以自定义方式进行处理，可能通过函数？

注意，不确定预期结果是什么？答案尝试演示一种使用ProcessingInstruction的方法 

// create `ProcessingInstruction`
var p = document.createProcessingInstruction("js", "{'"color'":'"blue'"}");
var div = document.getElementById("process");
document.body.insertBefore(p, div);
// use `ProcessingInstruction`
div.style.color = JSON.parse(div.previousSibling.nodeValue).color;
<!doctype html>
<html>
<body>
  <div id="process">Process</div>
</body>
</html>

相关文章：