weixin_45615650的博客

**canvas操作图片:**在画布上插入图片：在canvas中获取图片的路径：var img = new Image();img.src = “路径”ctx.drawImage(img,x,y,img.width,img.heigth)方法**在canvas设置背景：**ctx.createPatter(图片，平铺方式)方法这个方法有返回值，如果我们想要对我们的画布设置背景例：var patter = ctx.createPatter(图片，平铺方式);ctx.fillSty

**绘制圆：**arc方法ctx.arc(x,y,半径，开始位置的弧度，结束为的弧度，方向参数)方向参数是ture/flase 默认的是false（默认是逆时针方向）弧度的转换：度数 * Math.PI / 180（x,y）为圆心的位置在确定圆为实心还是空心实心：ctx.fill(); 边框：ctx.stroke();**绘制一条有弧度的曲线：**arcTo（）方法：arcTo() 方法在画布上创建介于两个切线之间的弧/曲线。arcTo(x1,y1,x2,y2,r);一

我们单独使用canvas绘制图形时我们只可以绘制矩形，但是我们还会有其他的图像，我们绘制其他的图像我们就要通过绘制路径的方法图绘制其他的图形**绘制路径的步骤：**1、移动画笔到起始位置：ctx . moveTo(x,y);2、绘制一条当前位置到下一个位置的线line（线）：（需要几条就画几条）ctx.lineTo(x,y);3、确定图像是填充的还是空心实线：**填充：**ctx.fill(); //里面没有参数 会自动合璧路径**轮廓：**ctx.stroke();

**简介：**canvas是H5中新增的元素，可以通过JavaScript中的脚本绘制图形注意;我们在使用canvas时，遇到低版本浏览器不支持时，我们在canvas标签中添加的所有元素内容都会被显示出来，我们就可以利用这一点添加提醒语句，如果支持则不管canvas中存在什么都会被隐藏不会显示，我们在浏览器看到的只是canvas，通俗的来讲canvas只是画布**使用：**canvas只是一个画布，要想在其上绘制内容我们需要找到他的渲染上下文getContext（）方法，这个方法主要是用

**classList方法：**这个方法可以操作class，在原来的H4等，我们如果想要操作类会比较麻烦在H5中我们添加一个类：testNode.classList.add(" ");**删除一个类：**testNode.classList.remove(" ");**切换的方法：**（如果没有就新增，如果有就删除）testNode.classList.toggle(" ");**H5中获取自定义属性值：**dataset方法：例：我们在使用这个方法是，我们的命名要以d

**新增语义化标签：**hgroup：代表网页或section的标题当元素出现多个层级，我们可以将h1~h6放在其中注意：1、如果只有一个标题标签就不要使用hgroup2、存在多个就使用3、如果有多个标题和文章数据，标题标签（h1~h6）就使用hgroup包住，和其他数据一起放入header标签中header：代表网页或section的头部（1）section：独立内容区块，可以用h1~h6组成大纲，表示文档结构，也可以有章节、页眉、页脚或页眉的其他部分；（2）article：特殊

**相关概念：**attribute：html的预定义和自定义属性我们统称为attributeproperty：js原生对象的直接属性我们称为propertyproperty属性为布尔值的，我们称为布尔值属性property属性值为非布尔值的，我们称为非布尔值属性**attribute与property的同步关系：**非布尔值属性：实时同步布尔值属性：property永远都不会同步attribute在没有动过property的情况下attribute会同步property在动过