新人學(xué)習(xí)svg,說(shuō)說(shuō)我在svg上遇到的坑,持續(xù)更新.
5.gif
注意以下幾點(diǎn)
1.svg不能直接操縱dom元素
.setAttributeNS相當(dāng)于dom中.setAttribute
2.使用拼接animateMotion標(biāo)簽的方法不能獲取到beginElement
無(wú)法獲取beginElement
要使用svg的方式
document.createElementNS('http://www.w3.org/2000/svg', 'animateMotion');
事例代碼
animation = document.createElementNS('http://www.w3.org/2000/svg', 'animateMotion');
animation.setAttributeNS(null, 'id', 'temp_'+(new Date().getTime()));
animation.setAttributeNS(null, 'begin', '0');
// animation.setAttributeNS(null, 'end', '');
animation.setAttributeNS(null, 'dur', args.duration+'s');
animation.setAttributeNS(null, 'repeatCount', '1');
animation.setAttributeNS(null, 'path', path);
square.append(animation);
console.log(animation);
console.log(typeof animation.beginElement);
animation.beginElement(); 