canvas

来源:1-4 综合实例:SVG编辑器

诺丁山丶

2016-08-29 16:01

function createSVG() {
   var svg = document.createElementNS(SVG_NS, 'svg');
   svg.setAttribute('width', '100%');
   svg.setAttribute('height', '100%');
   canvas.appendChild(svg);

   svg.addEventListener('click', function(e) {
       if (e.target.tagName.toLowerCase() in shapeInfo) {
           select(e.target);
       }
   });
   return svg;
}

 canvas.appendChild(svg); 这里的 canvas 并没有任何定义,为什么可以直接使用?

写回答 关注

2回答

  • medusaxi
    2016-08-30 22:55:01
    已采纳

    我们可以通过id直接访问对象,是因为所有的元素ID都相当于一个保存对象的全局变量。

    但标准写法还是document.getElementById。

    当整个页面上只有唯一一个id时,你用id的效果差不多等同于document.getElementByid()。HTML元素拥有的属性方法(比如appendChild()),id和document.getElementByid都可以正常使用。


    但是当页面上有2个以上相同id的元素时,直接用id和document.getElementByid得到的是不同的东西,前者是一个数组,是所有相同id的元素的集合;后者是一个单独的html元素,是相同id的元素集合中的第一个元素。你可以自己试验下打印出来看看是啥。所以此时,HTML元素拥有的属性方法(比如appendChild()),id用不起,只有document.getElementByid才用得起。

    总之,记得  :document.getElementByid  才是标准的通过id获得html元素的标准写法就行了。视频老师只是懒得打字而已就省略了,我们自己开发中不要这么做。

    ps:补充:

    如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象。

    如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名. 
    如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个。


    诺丁山丶

    非常感谢!

    2016-09-06 23:30:13

    共 1 条回复 >

  • Tbug
    2016-09-26 08:57:32

    奥,原来是这样子

走进SVG

SVG是HTML5 中矢量图的标记语言,学习后掌握更多的干货

52652 学习 · 213 问题

查看课程

相似问题