<script>
function getRandomColor(){
var r = Math.floor(Math.random()*266)
var g = Math.floor(Math.random()*266)
var b = Math.floor(Math.random()*266)
return `rgb(${r},${g},${b})`
}
window.onload = function(){
var c1 = document.getElementById('c1')
var ctx = c1.getContext('2d')
// ctx.rect(100,100,100,100)
ctx.fillStyle= getRandomColor();
// ctx.fill()
// ctx.strokeRect(100,100,100,100)
ctx.fillRect(100,100,100,100)
}
</script>
总结下:
1 随机生成颜色值
2, rect 只是路径方法
3, fillRect 既是路径也进行有有效填充
4. strokeRect 既是路径也是进行描边操作