使这些功能ie9兼容

时间:2014-07-24 08:09:37

标签: javascript dom internet-explorer-9

我在ie9中尝试了这些功能(即ie10设置为ie9仿真)。 在那些函数中,“doc”是svg文档的根元素。 addSvgTransform

  /**
   * Add a <g> element that envelop all SCG elements and makes the viewbox transformMatrix descend on all elements
   */
  function addSvgTransform(doc, matrix) {
    matrix[3] = matrix[0] = (matrix[0] > matrix[3] ? matrix[3] : matrix[0]);
    if (!(matrix[0] !== 1 || matrix[3] !== 1 || matrix[4] !== 0 || matrix[5] !== 0)) return;
    // default is to preserve aspect ratio
    // preserveAspectRatio attribute to be implemented
    var el = document.createElement('g');
    while (doc.firstChild != null) {
      var node = doc.firstChild;
      el.appendChild(node);
    }
    el.setAttribute('transform','matrix(' + matrix[0] + ' ' + matrix[1] + ' ' + matrix[2] + ' ' + matrix[3] + ' ' + matrix[4] + ' ' + matrix[5] + ')');
    doc.appendChild(el);
  }

失败点: el是一个document.element。 ie9不希望从我们的SVG中将任何其他节点附加到此类节点,并且它不希望相反,将该节点直接附加到Svg doc。 我们的doc变量没有createElement方法。 该函数的Purpouse是在doc的根和所有其他元素之间添加'G'元素

这已解决 做var el = document.createElement('g'); ==&GT; :var el = doc.ownerDocument.createElement('g');

parseUseDirectives

  function parseUseDirectives(doc) {
    var nodelist = doc.getElementsByTagName('use');
    while (nodelist.length) {
      var el = nodelist[0],
          xlink = el.getAttribute('xlink:href').substr(1),
          x = el.getAttribute('x') || 0,
          y = el.getAttribute('y') || 0,
          el2 = doc.getElementById(xlink).cloneNode(true),
          currentTrans = (el.getAttribute('transform') || '') + ' translate(' + x + ', ' + y + ')',
          parentNode;

      for (var j = 0, attrs = el.attributes, l = attrs.length; j < l; j++) {
        var attr = attrs.item(j);
        if (attr.nodeName === 'x' || attr.nodeName === 'y' || attr.nodeName === 'xlink:href') continue;

        if (attr.nodeName === 'transform') {
          currentTrans = currentTrans + ' ' + attr.nodeValue;
        }
        else {
          el2.setAttribute(attr.nodeName, attr.nodeValue);
        }
      }

      el2.setAttribute('transform', currentTrans);
      el2.removeAttribute('id');
      parentNode = el.parentNode;
      parentNode.replaceChild(el2, el);
    }
  }

此功能失败,因为doc没有doc.getElementById方法。

编辑:这里的问题是iea的nodeByID方法。要使用它,我必须指定id属性是ID或XS:ID类型。 要做到这一点,我必须添加一个xsd或dtd架构,如果我理解良好。 所以我想在解析文档之前添加这种表示法。 我应该写什么?

<xsd:attribute name="id" type="xsd:ID" />

在哪儿?怎么样?任何想法,帮助?

0 个答案:

没有答案