javascript - 如何使用 javascript 操作 SVG 节点，以便它可以在 MS Edge 中工作？

Question

我有一个 svg 元素，里面有 linearGradient 。在某些时候，我需要更改渐变颜色，所以我这样做:

var stops = [];
for (var i in description) {
    stops.push('<stop offset="' + i + '" stop-color="' + description[i] + '"/>');
}
var colorBar = svg.getElementById('colorMapGradient');
colorBar.innerHTML = stops.join('');

它在 FF 和 Chrome 中工作得很好，但当我的页面在 Edge 中加载时不会改变任何事情。当我在该浏览器中调试它时，我看不到 colorBar 对象的属性，包括 innerHtml，就好像它不是一个普通的 HTML 节点(我猜是的)。然而，一组常用的属性在其他浏览器中是可见的。 那么是否有任何解决方法可以将颜色停止设置为 Edge 中的 LinearGradient ？

Answer 1

感谢Robert Longson ，我通过从 javascript 访问 DOM 使其工作:

            var colorBar = svg.getElementById('colorMapGradient');
            while (colorBar.firstChild) {
                colorBar.removeChild(colorBar.firstChild);
            }
            for (var i in description) {
                var stopNode = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
                stopNode.setAttribute('offset', i);
                stopNode.setAttribute('stop-color', description[i]);
                colorBar.appendChild(stopNode);
            }