HTML页面中的DOM操作
DOM大家应该很熟悉了,这里先看一个小例子:
复制代码
代码如下:复制代码
代码如下:
element.setAttribute("x", "10");
element.setAttribute("y", "20");
element.setAttribute("width", "100%");
element.setAttribute("height", "2em");
而SVG DOM的方式:
复制代码
代码如下:
element.x.baseVal.value = 10;
element.y.baseVal.value = 20;
element.width.baseVal.newValueSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_PERCENTAGE, 100);
element.height.baseVal.newValueSpecifiedUnits(SVGLength.SVG_LENGTHTYPE_EMS, 10);
DOM脚本属于传统的脚本,其特征是通过构建“值字符串”来设置各个项。SVG DOM脚本样式的优点是,你不必构建“值字符串”,所以性能优于DOM脚本。
嵌入SVG的脚本
如果要在SVG内部添加脚本,就需要使用script元素,这个前面已经讲过了,除了这一点,基本上与把脚本放到外面的HTML中是一样的。看一个例子:
复制代码
代码如下: