jsplumb中文教程
粉丝212获赞461
相关视频
03:47查看AI文稿AI文稿这节课来讲 gs 的算数运算，常用的算数运算有加、减、乘除、曲磨以及自增。每个运算都是什么意思？来直接看代码，这里定义了三个变量， a 的值是十二， b 的值是五， c 的值是 a 加 b， 这个加号是加法运算，系的值就是十七。下面这一行的作用就是把系的结果在浏览器的控制台上打印出来， 怎么看这个结果？在浏览器界面按 f 十二键，也就是打开开发者工具，这里边的啃色选项就是浏览器的控制台，这行就是我们的打印结果， 这是加法运算。来看其他几个运算，这是减法，乘法，这是除法，先除以后， 如果不是整数，会以小数形式显示。下面这个是取模预算。什么是取模？也就是取于 他表示的结果是 a 除以 b 以后所剩的余数，十二除以五，如果不用小数表示的话，那么他等于二余二，余数是二，也就是他的结果来看一下结果， 十二除以五等于二点四，用余数来表示的话，十二除以五，他的余数是二。 来看至尊预算， a 加加，他表示 a 增加，一 来看结果，把 a 打印出来， 把这几个都去掉来看浏览器 结果是十三。那我这样写，把它分给一个变量 d 等于 a 加加，然后把 d 打印出来， d 的值应该是多少？是十三吗？来看结果 还是十二。那都自增一了，为什么地还是十二？刚才打印的不是十三吗？来解释一下， 他表达的意思是后加一，在最后再加一，如果有负值或者是前面表达式的话，先进行运算，最后再加一。在这里就先把 a 负值给 b， 最后 a 再加一，所以 d 的值是在 a 加一之前的值，也就还是十二， a 最后再加一，这时候 a 就变成了十三，看一下 结果 a 是十三。还有一种方式是把加号写在前边， 他的意思就跟刚才正好相反，加号在前面是给 a 先加一，然后再复制或者进行其他运算， 这时候地才是十三， a 也是十三。来看结果 是这样的，这就是他们 两个的区别，说到他俩的区别，知道就行了。在实际开发中，很少有哪地方要求对他俩进行区别的，最多可能有些考试或者基础的面试会用到，这是自增，但是还要自检。前面是或者后边是两个减号是减一 放前面和放后边，他的区别是和这个加号是一样的。好了，这节课就到这里。
165人人都会软件编程
13:19查看AI文稿AI文稿大家好，这节课我们来了解数组的叠带操作，数组的叠带啊，就是对每个元素进行一个操作 上，此刻我们了解到数组的便利方法啊，那么传入一个函数啊，比如说这里我写了一个叫套路的函数啊，对 竖左灯中的每个元素进行便利啊，进行处理，怎么处理呢？就是把这个文本的值啊啊， 首先文本是空字母串，然后呢，把直啊都给他加起来啊，就是这个意思， 那么这个函数他接受三个参数啊，值，那么值就是数组当中的元素值啊， 然后还有元素的缩影，然后就是数足本身啊， 那么这个这个套路，这个函数啊，只用到了啊，这个值这一个参数，所以呢，其实啊，可以把这后面的两个参数啊给他省略掉， 大家可以想一下啊，他的结果是什么？ 然后啊，看看自己呢，写在实际的大码啊，敲一下，看看运行的结果跟你想象的是不是一样，这个就不多讲了。好，我们再看数组的映射方法，映射方法 同样的对每个元素执行函数来创建啊，新数组，那么映射方法不会对没有值的数组元素执行函数啊， 也不会更改原始的数组，同样他是传入一个 一个 啊，函数啊，这个函数呢，也同样的有三个参数啊，这里呢，我们只用到了一个啊，元素值这一个参数啊，所以这些其实可以省略掉啊，那么 这个映射啊，对函数值进行处理怎么处理呢？就是将每个值啊 啊，自乘啊，也就是计算啊，乘以二啊，就是每个计算每个数值的两倍是多少啊，然后 得到一个新数组，他跟上面这个便利这个方法的区别是啊， 便利他会改变啊，原数原数组，对不对？对这个数字进行了一个改变啊？ 啊？这个说法是错误的啊，不是改变了这个元素组，他是拿，就是从元素组里面的每个元素拿过来啊，进行一个处理啊，是这样的，这个 他也是啊，把数组中的每个元素拿过来进行处理，然后呢得到一个新数组啊，是这个意思，好筛选方法啊， 那么他呢，也是传入一个函数啊，那么 这个函数呢，他的返回值啊，是一个布尔值啊，根据这个布尔值啊，根据是真还是假来啊，判断这个元素， 留步留下来，就是这个意思啊，创建一个新数组，新数组里面的这个元素啊，就是根据这个比较的结果啊，是真还是假来判断这个元素， 就是从这个元数组里面筛选出一个，筛选出一些元素啊，组成一个新的数组，就是这个意思啊，这是筛选同样的啊，他可以传入三个参数啊， 比如说这个例子啊，从这个数组里面筛选出大于十八的所有的元素啊，组成一个新的数组，就是这个意思，好规定， 规定的意思呢，是对竖左的时候呢，元素啊，从左到右凉凉啊处理，然后呢得到一个竖直啊，是这样的， 比如说这个计算啊，这个数组的总和，我们就可以啊， 写一个套路这么一个函数啊，然后呢，首先 先是啊，四十五加四，把它的结果啊，再跟后面的元素进行规定处理啊，这三个的结果啊，再跟这个后面的一个元素进行规定处理， 那么规定的这个回调函数呢？接受啊，四个参数，第一个是总计啊，这个名字可能取得不太好，反正就是初始值或者先前返回的值啊，他是这个意思，然后就是传入的 一个一个的元素值，然后是元素，所以数组本身啊，这里因为计算的是啊这个数组的和，所以用了一个总叫总计的这么一个名字啊。那么比如说对第一个元 进行规定处理的时候，那么总计呢？就认为啊，是零对不对？零加上四十五还是四十五，这样的话， 对第二个元素进行规定处理的时候，这个总计啊就变成了之前的四十五，对不对？所以是 然后传入这个值就是元素值，传入这个四就是四十九，对不对？然后再的第三个元素啊，同样的第三个元素的值是九，他的总计的结果，总计是先前返回的值啊，就是四十九加九啊，五十八，对不对？ 当然你可以写减法呀，或者惩罚什么之类的，或者更复杂的一些操作都是可以的啊。总之这一个第一个参数是设定的一个初始值或者先前啊 返回的直， 如果啊，你 不给定啊，怎么样就是怎么样给这个回掉函数呢？指定一个初始值啊，就是在 这个规定的指定规定的第二个参数就可以了，通过这样的方法啊，就可以指定一个初始值啊，如果不指定初始值的话，就是先前返回的值，对于这个来说，先前什么都没有返回，所以就返回一个零，对不对？所以就是零，是这个意思啊， 好，右规定跟前面所讲的规定啊啊，类似，不过 他是从右到左啊来进行处理的啊，同样的也可以指定啊，一个初始值， 也就是对于这个例子来说，首先传入的值是二十五啊，也就是这个值等于二十五啊，是这样的， 他是先计算二十五，然后二十五加十六的，结果是四十一，对不对？然后四十一再加九，是这样算的啊，当然也可以是跟其他更复杂的操作全为真啊，就是判断啊， 这个数组当中的元素是不是全部都符合某个条件 啊，而某个条件呢啊，就是传入一个参数啊，传入一个函数，对不对？就是用这个函数啊，对这些元素对传入的每个元素进行处理啊，看看结果 要求啊，所有的元素经过这个函数的处理之后，如果所有元素啊都符合条件啊，都也就是返回值啊，经过处理之后的返回值都是真啊，那么 那么就说明这个数左啊，当中的每个元素啊，都啊符合某个条件，就是这个意思，比如说这个是不是全部都大于一十八， 就是这个，然后任意为针啊，就是传入一个函数，看看这个，如果这个数组中当中的任何一个元素符合条件啊，那么这个数组就是具有某种性质啊，就是这个意思， 这也很好理解，对不对？对于这个数组是不是啊，其中的只要任何任何只要有一个元素啊大于十八，那么这个 就是说啊，这个有元素大于十八，是不是就是可以判断他有啊，有这个属性啊，有大于十八的这个元素，就是这个意思。好，那么通过对数组也可以通过 所有的方法来找出元素某个元素值啊，啊，存不存在，如果存在就返回他的位置啊，也就是他的下标啊，比如说这个 苹果存不存在？存在，那么返回他的下标啊，零，如果没有找到这个元素啊，也就是这个元素不存在 这个数字当中，那么返回复一啊右，所以它的意思是从右边开始搜索， 如果啊这里面对不对？有两个苹果，那么他返回的，所以你就是啊二，对不对？这是下边二的元素，是这样的 查找，那么就是通过测试函数啊，查找传入一个函数啊，对 这个他的参数啊，这个函数的参数跟上面其他的一些方法是类似的啊，然后对每个元素啊进行一个处理， 这个啊，例子是查找大于十八的第一个元素的值啊， 那么呢他就会把每个元素啊一个一个的传入这个函数进行处理。四大于十八吗？九大于十八吗？ 十六大于十八吗？二十五大于十八吗？哎，大于十八是不是？所以就找到了，那么就返回这个值，所以第一个是就等于二十五啊，就是这个意思， 这是查找方法，然后呢还有查找锁引这个方法啊，他返回的是找到的这个元素的下标啊， 那么对于这个数字来说，他找到了二十五，所以他返回的下标是，或者说所以是啊三啊，是这个意思，这是查找所以方法。 好具体的例子啊，这些例子啊，大家可以自己啊在写一些大码来验证，那么关于数组迭代就讲到这里，谢谢大家。
00:59查看AI文稿AI文稿我们现在来看一下 pfags 网站，网址是 p 五 js 点 org， 上面很多帮助我们学习编程资源。这个网站在二零一八年的时候有 kitssend 翻译成了中文，他也为我们提供了中文对照的编程词汇表。 链接我们的时候附上。在 pcus 首页我们可以看看到他的简介。点击参考文件，我们会可以看到关于颜色、形状等内容的介绍。这里就是我们日后编程用的参考书。比如说我们点击人的 椭圆，就会看到怎么用 tfriss 来绘制圆形。我们再来看看范例，里面有很多完整的编程例子，比如点击 vivi 宽度与高度，我们就可以看到如何用以下几行简单的代码来绘制出上方的图形。 最后跟大家聊一聊披发这次社群，这是我觉得披发非常独特，非常感人的地方，这里是。
102QTV
02:10:30
03:16查看AI文稿AI文稿今天呢咱们用爬虫实现一个在线翻译的功能，咱们输入任意的中文呢，能给他翻译成英文，比如说呢咱们输入 python， 哎，他翻译成蟒蛇啊，比如呢我们再输入这个 dog 狗啊，他就能给我们翻译成哎狗，哎，是不是很好玩？ 来我们看看这个背后的原理啊。呃，这边呢有一个在线翻译网站啊，我们这边呢如果输入一个猫啊，他就能帮我们翻译成猫啊，嗯，我们如果呢再输入其他单词呢，他也能帮我翻译啊，所以呢咱们就是用它提供接口呢来实现这个翻译啊。啊，首先呢我们要找到这个接口， 好，来，我们按一下 f 十二键，咱们从抓包开始。好，我们再次输入 dog 这个单词啊，我们会发现他发送了很多数据包啊，我们每个数据包呢，我们查看一下，其实呢我们最终发现啊，这个 v 二这个数据包 里面的数据呢是最丰富的啊，它包含了所有词典啊，所以呢这个 vr 就是咱们今天想要的这个宝藏。 呃，接下来呢咱们就要找这个加密参数了，在这个 v 二这个接口里面呢，我们发现 sin 这个神秘参数啊，他每次呢会随着翻译的单词不同呢而发生变化，而且呢这个数值呢啊，说实话咱们也看不懂， 而这个 token 啊里面还有 token 这个参数呢，他却保持不变啊，所以呢咱们初步判断啊， side 呢，这个就是加密的参数。好，那下面呢咱们用拍子呢构建一个 request 请求啊， 我们发现啊，当我们去掉撒引参数的时候呢，他请求就失败了，所以呢撒引啊，就是咱们今天要破解的这个参数了，然后呢就是要寻找加密函数的入口了，就是我们想知道这个撒引是如何产生的 啊，我们可以通过搜索来找啊，比如说呢，咱们搜索 side 加冒号，这时候呢我们看到有很多结果，那么哪个是真正的加密位置呢？其实啊，最开始我们谁都不知道，那我们都给他打上断点， 我们再次输入 dog， 我们终于找到了啊，这个 b 方法啊，运行后的值呢，就是这个 sin 的值啊，现在呢这个加密入口呢就已经找到了， 下面呢我们看看 b 方法具体是什么，咱们通过点击这个方式 location， 咱们就能看到这个 b 函数啊，好，那么我们下面呢就要在本地啊来实现啊，这个 b 函数一模一样的方法。 好，我们现在在拍插里面新建一个 gs 文件啊，把这个方法呢给他复制过来啊，然后呢咱们再调用它， 好运行的时候呢，肯定会碰到一些错误啊，但是呢咱们不用担心啊，咱们就按照这个提示呢来补充这个缺失的这个变量和方法。好运行到最后呢，我们还发现啊，缺少一个 g g k 的值啊， 好，那么我们把这个 jk 的值呢从网页中呢给他取出来啊，然后放到代码里面再次运行，哎，这次呢结果就正确了， 最后呢用 python 调用这段 g s 代码啊，实现模拟加密，把输入参数呢改为动态获取，这样子呢就能翻译任意的单词了啊，比如咱们输入 python 啊，翻译后的结果呢是蟒蛇 啊，就这样呢，咱们成功的用爬虫的 gsn 项技术呢，实现了在线翻译。我是拍瑞，关注我，我们一起学爬虫。
54152175025184
15:24
11:07查看AI文稿AI文稿哈喽，各位小伙伴们大家好，欢迎来到前段课堂，咱们这节课呢，来讲 doctor 们的对象的方法，获取元素。我们之前说的几点类型一共七个，我们主要讲的其中一个就是 doctormant 对不对？因为我们确实经常用到它，那我们用它干嘛呢？可以用它来获取页面之间的元素。 那我们想要操作页面的话，你是不是得获取到对应的那个元素或者获取呢？有对应那个 htm 结点就是，当然我们从到我们角角度描述的节点，从我们那边，从我们的 html 角角度描述就是元素或者叫标签，对不对？ 你可能获得到这个标签，你才能对他进行操作。那如何获取呢？就是通过我们接下来要讲的这些方法。好，我们这样先回到我们的开发者工具当中，我们创建一个全新的文件，叫 index 点 htiml。 哎，重命名一下啊， html 好补全一下。那在这里呢，咱们先放个 divdiv 呢，可以给他指定一个啊，就什么都不指定了，就一个 div 吧，咱们写一个嗨喽好吗？那右键运行的话，页面上肯定会展示出一个嗨喽的文本， 接下来我要把这个文本给改掉，能不能做到？或者是我要获得的这个文本能不能做到？能，就是通过 gs 来进行获取。 什么方式可以获取到呢？翻回来咱们来看文档，第一个是通过 get elements bytie 跟内幕去获取，那这个方法如何获取呢？来看描述啊，这个方法是搜索 hti 买楼标签名， 返回符合条件的元素，他的返回只是一个类似数组的对象，我们称他为 html clux， 就是集合，可以实时反映 html 稳当的变 变化，如果没有任何元素匹配就返回一个空集，那就说明我们可以通过这个方法来获取到页面的元素。这个方法呢，我们需要传入的是什么？是一个标签名称。好，那我们演示一下啊，这边咱们这么来过，刀口闷特点儿， gets elements 拜胎根内母，对啊，胎根内母。然后咱们要获解什么是这个 div 对不对？然后把 div 扔进去就行了，就是把标签名字直接扔进去，我们外面挂一个叫 divs 的吧，通过这个 去存储它，咱们这样把这个谁打印出来，把这个 divs 打印出来，大家会发现这个 s 里面是包含这个 div 的。好，翻回来咱们看控制台的打印啊，刷新可以看到有打印返回的是一个 htimlocolux， 就集合它是一个类似数组的效果。为什么是类似数组呢 啊？因为这个元素你可以有一个，你是不是还可以有两个？还有一，还有二，对不对？翻过来刷新他就是两个，那么这个东西怎么就获取到其中一个呢？就是通过 数组的方式来读取就行了，比如说我读第零个元素就是第一个刷新啊，第一个，嗨喽，我读第二个元素，读一啊，下边还是从零开始，就是第二个嗨喽二，看是不是啊，这就是读取到这个内容了， 比如我们就读取第零个内容，对吧？这个 div 一，好吧，那现在见面我们打印 div 一，那么这面我们就拿到是第一个元素，嗨喽一，那这个时候拿到这个元素怎样？我们可以把这个内容读读取了，那我们还可以去修改这个内容。怎么修改呢？我们直接这样 通过 div 有一个方法叫 inner html， 这个方法咱们还没讲，后续我会给大家讲这个方法，咱们先用一下， 好吧，比如说我给他修改成什么 hello word， w o r l d 保存，现在页面的内容就会发生变化，我们一刷新，你看由原来的 hello e 变成什么 hello word， 是不是就通过 gs 达到了操作页面元素的目的啊？ 对不对啊？这就是我们的第一个方法， get elements by tigernam， 他说如果传入星号的情况下呢，就是代表获取页面所有的 htm 元素，这个意义不是特别大啊，大家可以自己测试一下就行了。好吧，来看第二个方法 叫 get elements by class 内幕，哎，这个是通过 class 的名称就获取，啥意思呢？我们不看描述了，直接在这里边。假如说我有个 p 标签，里面有一个 hello 还是，那现在呢？在这里我们需要给他指定一个要 class 的属性。我们知道以前 class 我们是用来 设置样式的，他不仅可以设置样式，还可以用来作为页面读取元素的一个标识，比如说这是一个 tize。 好吧，那接下来在这里我们就可以外一个 text 等于什么呢？ document 点 gets gets element by class name 看到了吗？括号把谁放进去？把这个 class 的名字放进来，那么此时我们打印这个 tex， 依然是可以得到这个元素的 保存。翻回来一刷新，大家可以看到页面依然读取这个元素，依然还是一个 hiphoneyx， 老样子，我们想读的这个元素后面加一个零 就能读到这个元素了，翻回来刷新看，是不是变成了一个皮标间，里面包裹于嗨喽啊，能不能改变内容啊？当然可以啊，老样子，在这里边还是他点 inner html 就可以读取，到 最后还是给他改成一个嗨喽加叹号吧，行不行？你看原本他就是一个嗨喽对不对？咱们一刷新，他有个嗨喽叫什么？加叹号，对不对？也达到这个目的了，这是第二种方式。除了第二种方式之外呢，咱们还有第三种 啊，当然这种的话他这面还有多说了，你还可以里面读两个克拉斯的形式，对吧？也没问题啊，大家自己测试。然后这边呢，还可以通过 bye neme， bye neme 什么？就如果你给页面元素增加一个内幕属性，你还可以通过内幕来读取它。最常见的就是表单网，比如说我们写个表单 form， 不要表单 x， 咱们删掉啊，没用。然后我们需要给表单指指定个名字，对吧？咱们以前都写过，比如说这个是 logue 登录的表单，对吧？那此时这里边我们就可以通过名字来 获取内幕，好吧， documentary gets elements by 内幕，把谁放进去啊？把这个捞给你放进去。 然后接下来呢，咱们就可以打印了，打印这个内幕就行了。那么现在大家再来看一下刷新看，哎，这面打印是个哦不这个的类型对吧？但是其实我们已经读到了，不过这种方式使用率极低 啊，大家就知道有这么个方法就行了，日后大家基本上也看不到他，但前两种都可都是常用的啊，我没有标使用率低的，说明他都常用好吗？好，咱们接着往下看。 最常用的来了，就是 get element by id， 啥意思呢？给页面元素设置一个 id， 给他设置一个什么 id id， 比如叫什么呢？叫这个 入场跟容器。好吧，里面写一个，哈哈哈，那现在我们就可以通过哇，一个 id 等于咱们别叫 id， 叫入场吧，好吧，等于刀口们的点 gets elements bye id， 注意这个 elements 没有 s 之前都是 elements elements elements。 elements 代表返回，是一个集合，就是返回德国元素的。那如果加了 id 呢？就只会返回当前元素，为什么？因为我们知道 id 名字是不能重复的，这个名字对不对？所以说这个时候你不用在后面加任何内容，直接打印就可以获取到什么？获取到这个入特元素了，反过来刷新 看，直接读到这个元素啊，对不对？因为他是读一个，你像我们上面讲这些都是读一群啊，你可以有多个重复的，比如说泰克斯，你可以有多个元素都叫泰克斯，对不对？但 id 不一样，只有一个，所以他是唯一， 那当然我们能不能改变内容一样可以，对吧？点音呢？这前面写成一个，呵呵呵，原来是，哈哈哈哈，对吧？咱们原来是，哈哈哈，现在咱们一刷新变成了，呵呵呵， 对不对？好，那接着往下看。以上我们所讲这些呢，都是 h， 就是在新版本，以前的老版本就是 h 五以前的，那 h 五之后呢？又增加了两个，也比较常用。咱们来看一下哪两个啊？ 第一个呢，叫 quarry selection， quarry selection 看一下他的读法啊，他说方法接受一个克拉斯选择器作为参数，克拉斯选择器作为参数， 返回匹配到该元素节点，如果是多个，满足匹配条件，则返回第一个。如果没有发案，匹配返回的返回闹。如果没有匹配的节点，返回闹。啥意思啊？ 他呢？跟盖的 alem 的 buy id 一样，只能返回一个，如果有多个同样的元素，只返回第一个。好，比如我们给大家举个例子，这边我们再放一个 divdiv 给他一个 class 吧。假如说这 class 呢？叫 嗯啊，别比较随意啊。比如说我们接下来可能放一个嗯为导航，对吧？但是我有两个导航，这个嗯为一，这个是嗯为二，那现在我们就可以去获取了，怎么获取呢？嗯，为 s 等于 documentar 第二， 对吧？ cory selector， 然后把谁放进去呢？把这个嗯为放进去。注意，因为这边接收的不再是单纯一个名字了，而是这个选择器。什么叫选择器啊？前面你要给他加， 如果是 ab 就加井号，如果是 class 就加点，是不是 css 选择器啊？好，这个时候咱们打印他能打印几个呀？他能，只能打印 nv， 这面我们改成 nv 啊，他只能打印一个，默认就是第一个 nv 一，咱们看是不是 刷新看是不是打印了 n v e 啊？好，当然想改变，能不能改变？能，那个能说。老师我要获取多个呢？也能获取，就是下面这个叫写宽瑞写莱克强奥的方法，奥多个吗？对吧？所以咱们下面可以这样画一个 nvs 等于什么？ documentar 点 quarry select 奥，选择这个奥的方法还是点 nv， 对吧？这个时候咱们再来打印这个 nvs， 就是打印这个变量，那这个时候获取的就是多个了，翻过来刷新看一眼， 看这面返回是个 no 的，历史的跟那个一个意思啊，还是集合的意思。这里有两个元素，想读一个，那还是在这后面加上零或者一， 咱们读一，好吧？读第二个元素，翻过来刷新打印的是，嗯，为二，对不对？那能读到了，能不能改变里面内容啊？当然可以啊，这就是通过 document 这个节点给我们提供的获取元素的方法，大家只需要掌握。呃，这两个再加上后面这三个，就足够应付咱们接下来的开发的需求了好吗？ ok， 记住这些方法啊。掌握了以上内容之后呢，咱们来看实时效果反馈来看，他说以下哪个可以通过 ad 来获取页面元素对象？ ad 哪个是啊？最后一个是吗？不是，这是内幕，这个是吗？这是克拉斯，这个呢？这是元素名称，只有 a 的暗示，对不对？ 好，这是第一个题，选择 a， 看第二题，他说以下哪个是通过克拉斯获取元素对象的？这是 id， 这是什么 内幕？这个呢？是名字标签，名字只有 c， 答案是克拉斯的方式，克拉斯内幕吧，对吧？所以正确答案选择 c。 ok， 那么关于咱们的 doctorman 的方法获取元素呢，就给大家说到这里，感谢各位聆听，咱们下期再见。
19尚学堂（北京）
05:01
00:56查看AI文稿AI文稿大家好，这里是 qtv， 我们会一起来聊聊关于创意编程、艺术与科技相关的话题。现在来了解一下 pfgs 的网页编辑器。 这款网页网页编辑器是我们不需要下载任何东西，就能直接在网页上进行编程，并且立刻看到编程的效果。这个网页编程器分为左右两边，左边是代码，右边是预览。当你打开网页的时候，你会看到系统自带的几行代码， 我们如果点击左上方的运行按钮，就会看到屏幕右边出现了一个四百乘四百的灰色画布，这就是左边这几行代码的效果。 我们先来了解一下这几个英文单词的意思， function 是功能， set up 是设置， quick canvas 是创建画布， drawer 是绘制， background 就是背景。
77QTV
![[网站开发入门指南118] 用Grid布局实现表格案例 第1部分 grid布局｜ html css 零基础入门教程
#html #css #前端 #网站开发 #javascript](https://p3-pc-sign.douyinpic.com/image-cut-tos-priv/6232ecfdf5ced65ac23340f7878262b8~tplv-dy-resize-origshort-autoq-75:330.jpeg?lk3s=138a59ce&x-expires=2106424800&x-signature=N6R%2Bof1mIVMsGao2cjObJRRrdTY%3D&from=327834062&s=PackSourceEnum_AWEME_DETAIL&se=false&sc=cover&biz_tag=pcweb_cover&l=20261004063241E8DB3E313C5293675AA2)
