jquery - Document.createElementNS() 的 jQuery 是什么？

Question

Document.createElementNS() 的 jQuery 是什么？

function emleGraphicToSvg(aGraphicNode) {
  var lu = function luf(aPrefix){
    switch (aPrefix){
      case 'xhtml': return 'http://www.w3.org/1999/xhtml';
      case 'math':  return 'http://www.w3.org/1998/Math/MathML';
      case 'svg':   return 'http://www.w3.org/2000/svg';
      }
    return '';
    };
  var svg = document.evaluate("svg:svg",
    aGraphicNode, lu, XPathResult.FIRST_ORDERED_NODE_TYPE, null).
    singleNodeValue;
  $(svg).children().remove();
  rect = document.createElementNS(lu('svg'), "rect");
  rect.setAttribute("x", "35");
  rect.setAttribute("y", "25");
  rect.setAttribute("width", "200");
  rect.setAttribute("height", "50");
  rect.setAttribute("class", "emleGraphicOutline");
  svg.appendChild(rect);
  }

该代码是 Emle - Electronic Mathematics Laboratory Equipment 的简化片段JavaScript 文件 emle_lab.js .

查找函数 luf() 将完整引用映射到 XPath 字符串和 createElementNS() 中命名空间的缩写名称。现有的 svg:svg 被定位、删除并替换为新的矩形。

Answer 1

What is jQuery for Document.createElementNS()?

那就是:

$(document.createElementNS('namespace', 'tag'))

所以在OP的例子中:

rect = $(document.createElementNS(lu('svg'), 'rect'))
    .addClass('emleGraphicOutline')
    .attr({
        x: 35,
        y: 25,
        width: 200,
        height: 50
    });

当然，使用 jQuery 并没有真正获得太多好处。无论如何，我们总是可以用 jQuery 来包装 DOM 节点，例如:使用 vanilla JS 创建 rect 后的 $(rect) 。

请注意，jQuery 对于 SVG 还存在其他问题，例如由于 lowercasing attributes 导致 viewBox 中断。 ，所以某些属性仍然必须使用纯JS。