javascript - 在创建时设置 Canvas 宽度/高度

Question

因此，我尝试在 jQueryUI 小部件中创建一个 Canvas 对象，该对象具有由用户指定的宽度和高度。然后用渐变填充该 Canvas 。

这样做不行，fillrect 的宽度太窄了

this.canvas = $("<canvas/>", { width: this.options.width, height: this.options.height }).appendTo(this.element);

但是这样做是可行的

this.canvas = $("<canvas width=\""+ this.options.width + "\" height=\""+ this.options.height + "\"/>").appendTo(this.element);

这两种方法有什么区别？

Answer 1

在第二种情况下，canvas元素的宽高会被添加为一个属性，这才是canvas宽高的正确设置方式。

在第一种情况下， Canvas 的宽度和高度将设置为 css 样式。使用css设置 Canvas 宽高不会设置 Canvas 元素的实际宽度和高度，它只会给出原始 Canvas 的缩放效果(此尺寸不会被视为执行内部计算)。

检查以下 SO Question更多信息...