关注前端这点事主要介绍web前端开发及互联网相关的一些内容与_H5之家

jQuery技术

字号+ 作者：H5之家来源：H5之家 2015-10-16 19:02 我要评论( )

关注前端这点事 nbsp;nbsp;var svg = document.createElementNS(http://www.w3.org/2000/svg, svg);nbsp; nbsp; svg.setAttribute(width, 800);nbsp; nbsp; svg

[JavaScript] JS动态创建SVG元素并绑定事件

var svg = document.createElementNS("", "svg");

svg.setAttribute("width", "800");

svg.setAttribute("height", "500");

svg.addEventListener("load", function () { alert('loaded'); });

document.body.appendChild(svg);

复制代码

以上代码可创建SVG容器并追加到body元素下，如果要添加元素，使用以下代码：

var r = document.createElementNS("", "rect");

r.setAttribute("fill", "#120045");

r.setAttribute("x", "1");

r.setAttribute("y", "1");

r.setAttribute("width", "50%");

r.setAttribute("height", "50%");

r.addEventListener("click", function () { alert('clicked'); });

svg.appendChild(r);

复制代码

1.本站遵循行业规范，任何转载的稿件都会明确标注作者和来源；2.本站的原创文章，请转载时务必注明文章作者和来源，不尊重原创的行为我们将追究责任；3.作者投稿可能会经我们编辑修改或补充。

网友点评

精彩导读

热门资讯

关注我们

关注微信公众号，了解最新精彩内容