- 博客(41)
- 收藏
- 关注
RSS订阅原创 Vue简介
同时，Vue.js 还提供了一些高级特性，如组件化、指令等，使得开发者可以更加高效地开发复杂的单页应用。4.使用计算属性和侦听器：计算属性和侦听器是 Vue.js 提供的一些高级特性，可以用于处理复杂的逻辑和响应式的数据变化。同时，Vue.js 也支持自定义指令，可以根据需求进行扩展。组件化：Vue.js 支持组件化开发，可以将一个大型的应用拆分成多个小的组件，每个组件都有自己的状态和逻辑。自定义 v-model：Vue.js 提供了自定义 v-model 的高级特性，它可以用来创建更复杂的表单输入绑定。
2023-11-13 11:15:16
181
原创 前端简单的爱心形状
首先需要创建一个 HTML 文件，然后在其中添加 CSS 样式和 JavaScript 代码。这个示例使用了简单的 CSS 动画来创建爱心形状。你可以根据需要修改样式和动画效果。3.保存文件并在浏览器中打开它。你将看到一个红色的爱心形状。
2023-11-13 10:59:02
303
原创 深入理解JavaScript组件
同时，关注JavaScript组件的发展趋势，可以帮助我们跟上技术的步伐，不断提升自己的技能水平。Vue.js和React：Vue.js和React是目前最流行的JavaScript框架，它们提供了丰富的组件库和生态系统，可以帮助开发者快速构建复杂的Web应用。注册组件：将创建好的组件注册到全局或者局部的组件系统中，以便在其他组件中使用。使用组件：在其他组件中引用注册好的组件，通过属性、事件和方法来控制组件的行为。独立性：组件可以独立于其他组件运行，不会影响到其他组件的功能。
2023-11-13 10:53:50
184
原创 学生信息管理案例
把这些数据来渲染到数组去，因为增加和删除都需要渲染，然后呢我们输入完毕时候，我们的tbody这块会变成空的然后需要我们继续输入第二条表格，然后下面，我们需要遍历整个数组之后再通过inhtml的形式变成我们输入的形式，下面data-id是自定义属性，因为我们下面删除需要借助索引，不然不知道电脑咋知道你删掉的哪个。第二步我们就需要渲染这个数据，将数组的值来渲染到数组对象里面，之后呢我们需要追加，最后当我们输入完成录用时候，需要重置reset,最后一步，我们需要调用，不然不会显示我们输入的数据。
2023-07-11 00:10:21
855
27
原创 让小牛来跟着鼠标移动事件
第一步还是我们需要获取这个img的元素来进行动画效果，所以我们来定义小图片在各个方向的位置，下面已经写好注释了，大家可看一下，然后我们需要来做一个鼠标移动事件，然后我们这块为啥要除以2，是为了让图片位于中心的时候不会移动了，然后获取完XY轴之后，我们需要套入公式。让每当鼠标移动然后小牛会跟着我鼠标移动，接下来就是定义鼠标的位置了，然后我们来进行一个判断如果大于这个x轴则需要翻转，不然就不需要，下面就是我们设置的1小图片翻转的代码。接下来为了大家好复制，我直接放源码了。
2023-06-22 01:58:58
226
20
原创 使用JSAPl来做一个倒计时的效果
第三步操作我们先获取现在的时间戳，然后获取以后的时间戳，当我们得到剩余时间，需要转换成秒数，我已经把公式写道下面来了，大家可以自行观看，然后我们需要进行补0操作，为什么要进行补0操作，为了让我们时间显示更美观，比如08，09，当只有一位数时候，在前面就加上一个0，而这个操作已经用三元判断写出来了！我们第一部先来做这个页面的随机颜色，这块就是我们JS基础的部分了，先使用方法来定义一个随机函数，如果是true，我们就返回纯白色，如不是我们就来返回随机的颜色。今天的案例就到这块，记得二连噢！
2023-06-08 02:05:43
1383
4
原创 牛客刷题HTMLDay6(名企专题)
height > min-height > manx-height ，取min-height。max-height > min-height > height, 取 min-height。height > max-height > min-height，取max-height。min-height > height > max-height ，取min-height。min-height > max-height > height，取min-height。1.2021 360 前端工程师。
2023-06-07 19:27:40
1021
3
原创 实现滚动条电梯效果
然后进行我们第二个操作，还是定义一个自执行函数，然后我们来获取这个滚动条，来进行排他思想，这里也是进行一个判断，如果原来的active有这个对象，就移除，反之就不删除这个对象，然后这一个模块最后一个地方，我们需要获取到对应的大盒子，所以我们先来获取我们的自定义函数，然后根据小盒子来选大盒子，使用模板字符串来获取这些li的字符串，最后让我们来对应到相应的盒子位置。我们先需要设置一个自执行的函数，来防止我们变量的污染，下面我们来获取两个元素，然后还是给我们窗口也就是Windows来加一个滚动事件。
2023-06-07 02:13:13
624
30
原创 使用前端三件套来做一个点击事件
然后我们这里使用的大量的display布局，比如大盒子主轴，我们让它变成竖着的。box是我们整个盒子的容器，来装这四个圆圈的，所以我们这块也来使用弹性布局，不管你往里面加多少圆形，都会跟着阅览器屏幕适应宽高！首先我们来做一个HTML部分，这个案例对于新手来说，是比较友好的一个案例，逻辑性也比较简单！先还是需要我们获取全部的圆形，然后forEach我们需要变量循环，然后在我们圆形设置一个点击事件，然后放一个盒子，盒子里面装了circle四个小黑子，分别是用两个类名表示，一个是圆形，一个是颜色。
2023-06-05 20:39:31
864
3
原创 牛课刷题Day5(编程题)
第一个参数表示数组起始位置，第二个参数表示需要删除元素的个数，如果后面还有参数，则将随后的全部参数插入到第一个参数表示的起始位置。如果 string 以 0 开头，那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。当参数 radix 的值为 0，或没有设置该参数时，parseInt() 会根据 string 来判断数字的基数。解析： js的Array对象提供了一个叫concat()方法，连接两个或更多的数组，并返回结果。
2023-06-04 20:06:58
764
原创 牛客网刷题Day5
解析：由于一个元素拥有ID属性，那么ID属性值会成为window对象的一个属性，这意味在整个页面的生命周期中，除非自己手动去清除该属性，否则这个属性会引用着dom不释放掉，从而增加了内存负担。如果 main1.css 和 main2.css 中有相同的选择器规则，那么 main2.css 中的规则将合并 main1.css 的规则。D.点击按钮3的时候，原来被选择的按钮4是复选框，所以不影响，不会被取消选中，D错误。C.按钮2与按钮3是单选按钮，因此在点击按钮2的时候，按钮3就会被取消选中。
2023-06-04 19:27:31
640
原创 介绍js各种事件
当用户将该元素拖到可放置的元素上并释放鼠标按钮时，将移动该元素到可放置的元素中。在这个例子中，我们获取了ID为“myElement”的元素，并使用addEventListener()方法添加了一个鼠标移动事件监听器。在这个例子中，我们获取了ID为“myButton”的按钮元素，并使用addEventListener()方法添加了一个点击事件监听器。点击事件是指当用户单击页面上的某个元素时触发的事件。鼠标移动事件是指当用户将鼠标移动到页面上的某个元素上时触发的事件。六、窗口大小改变事件。
2023-06-02 18:13:07
8565
2
原创 一文介绍Js的数据结构
这个类有七个方法：insert()、remove()、removeNode()、findMinNode()、getRootNode()、inorder()、preorder()和postorder()。insert()方法将一个元素添加到树中，remove()方法从树中删除指定的元素，findMinNode()方法查找树中的最小元素，getRootNode()方法返回树的根节点，inorder()、preorder()和postorder()方法分别以不同的顺序遍历树中的所有节点。
2023-06-02 17:45:55
1662
原创 介绍CSDN的阅览器
大家好！今天给大家一款由csdn官方打造的一个界面阅览器意思就是靠我们自带的阅览器改变他的外观方式，这就是我用了CSDN阅览器之后的效果图然后我们也可以清晰看到我们整个界面，对于我们经常写csdn博客的小伙伴来说是很方便，因为只需要一点链接就可以进入官方主页，一点击红包就可以进去红包社区强红包，然后还有各种经常使用的东西也会根据自己需求来指定你需要的界面，然后我们的背景图片可以自己来更换不知道小伙伴看好下面的步骤点进去之后---选中本地文件就可以更改自己的背景图片了然后还有个功能点击这个按钮。
2023-06-02 17:28:38
1819
转载 不偷看密码的猫头鹰
自己创建一个js文件然后放在里面通过html来引入。第一个需要创建一个js文件来用于猫头鹰的遮眼的操作。第二个就是我们HTML里面的js操作。CSS源码在上面，需要重新引入一边。下面接着咱们的文本框和密码框。首先还是我们的HTML部分。今天要做的效果图片如下。
2023-06-02 16:17:29
192
1
原创 牛课刷题Day4(编程题)
1.请补全JavaScript函数，要求将第二个参数插入第一个参数数组的尾部，并且以数组的形式返回。2.请补全JavaScript函数，要求以数字的形式返回第一个参数数组中第二个参数所在的首个索引值。5.请补全JavaScript函数，要求以boolean的形式返回字符串首参中是否包含第二个参数。3.请补全JavaScript函数，要求以数字的形式返回数字参数向下取整的结果。4.请补全JavaScript函数，要求将整数参数反转之后输出。注意：如果数组中不存在目标值，则返回-1。
2023-06-02 13:56:52
134
原创 牛客刷题Day4
HTML5中不支持frame框架，只支持iframe框架，或者用服务器方创建的由多个页面组成的符合页面的形式，删除以上这三个标签。这些元素纯粹是为画面展示服务的，HTML5中提倡把画面展示性功能放在css中统一编辑。页面不跳转的标准应该是点击链接后，链接的效果(样式)没有发生变化。即a:visited 、a:hover 、a:active的样式不起作用。div > p：选择父元素是 的所有 元素。
2023-06-02 09:39:06
501
原创 使用CSS来制作下雨的效果
我们第一步呢还是先定义变量，loader，然后我们在下面在定义一个snow代表雪花，下面定义各自的变量，让20片雪花随机下滑。然后我们使用圆角边框，第二步我们来写伪元素，用伪元素画两个圆通过位置改变来组成云朵。第一是做我们云朵的形状：我们先得设置相对定位，这样雪花才能来到我们下面。第三个使用伪元素来设置雪花和雪花的动画效果。首先我们来制作HTML部分。这里使用了伪类选择器。
2023-06-02 01:07:35
690
29
原创 牛客刷题Day3
解析：Math.floor() 方法执行的是向下取整计算，它返回的是小于或等于函数参数，并且与之最接近的整数。5.请补全JavaScript函数，要求以boolean的形式返回字符串参数中是否包含数字。4.请补全JavaScript函数，要求找到数组参数中的最大值并返回。3.请补全JavaScript函数，要求将参数数组转换为字符串输出。1.请补全JavaScript函数，要求返回数字参数的整数部分。2.请补全JavaScript函数，要求将参数数组反转之后返回。解析：这个函数接受一个数组参数，并通过。
2023-06-01 16:25:30
184
原创 牛客刷题DAY3（编程题）
解析：且运算符"&&"的运算规则是：如果第一个运算子的布尔值为true，则返回第二个运算子的值（注意是值，不是布尔值）；如果第一个运算子的布尔值为false，则直接返回第一个运算子的值，且不再对第二个运算子求值。或运算符“||”的运算规则是：如果第一个运算子的布尔值为true，则返回第一个运算子的值，且不再对第二个运算子求值；可以使用JavaScript内置的Object.keys()函数来获取一个对象的所有属性名称（键名），然后将它们存储在一个数组中并返回即可。最后，返回转换后的结果即可。
2023-05-31 14:07:17
2062
原创 全选反选案例
我们现在都获取完了，进行点击事件，我们得需要一点击大复选框我们就会自动选中下面的小复选框，最后得出结果只有两个值turn或者是false，如果只有单个被选中那么就输出false，如果全部被选中就输出ture。document.querySelectorAll('.ck:checked').length 的意思是选中所有的被选中的小复选框，然后后面就是进行一个判断，如果你的小复选框都被选中，你的大复选框就会被选中。🐼座右铭：懒惰受到的惩罚不仅仅是自己的失败，还有别人的成功。让小复选框等于我们的大复选框。
2023-05-30 22:38:36
1923
27
原创 牛客网DAY2(编程题)
1. "topbranch"是圣诞树的上枝叶，该上枝叶仅通过边框属性、左浮动、左外边距即可实现。边框的属性依次是：宽度为100px、是直线、颜色为green（未显示的边框颜色都为透明）2. "middleBranch"是圣诞树的中枝叶，该上枝叶仅通过边框属性即可实现。边框的属性依次是：宽度为200px、是直线、颜色为green（未显示的边框颜色都为透明）中枝叶的效果和上都是一样的，但是需要边框的大小即可。1. 上枝叶、树干的居中都是通过左外边距实现的。2. 没有显示的边框，其属性都是透明（属性）
2023-05-30 13:35:09
2204
2
原创 用CSS来做一个动画案例
content必不可少，因为这是一个主体，没有这个就没有内容，然后我们在继续设置绝对定位，置于左上角，然后设置宽高颜色，最后我们添加一个过渡方式，然后再下面我们来加动画。设置一个隐藏多余的样式，然后我们设置这个盒子宽高大小还有内外边距还有边框弧度加上内阴影弧度，最后设置一个相对定位，使他的子元素设置为据对定位。来设置每个滑块初始的动画延迟时间，这意味着第一个滑块不需要任何延迟，而后面的滑块则依次加上 0.5 秒的延迟时间。到百分比也就是to的时候就是还原，这里的filter我们是给他添加一个过渡的颜色。
2023-05-29 23:15:58
2550
6
原创 牛客刷题（HTML-Day1）
解析：可以被继承的属性： 字体系列：font-family，font-size，font-style，font-weight，font-stretch，font-size-adjust；列表相关：list-style，list-style-image，list-style-position，list-style-type，list-style-color；虽然 HTML5 加了新元素，但它也淘汰了一些旧元素，如 <big>、<center>、<font>、<tt>、<strike> 等。
2023-05-29 12:52:34
3290
原创 牛客刷题（HTML-Day1）
<head> <meta charset="utf-8" /> <title>牛客网</title> <link rel="stylesheet" href="XXX.css" /> </head> <body> <div>可见内容</div> </body>
2023-05-29 12:35:52
3116
原创 使用JS来实现tab栏切换
我们这里使用的是：document.querySelectorAll，因为要我们直接获取全部的a标签，所以我们写这个会更好，然后我们需要遍历这个a，运用到for循环。然后我们如果选择第一个，那么我们第二个就不会显示出来，所以我们选择第一个的时候得干掉第二个，这时候我们就可以使用这行代码。这是我今天从学习的知识点，今天试着做了一个tab栏切换，学到很多的知识点，讲师也比学校的老师讲的更加详细明白。这里的意思是我们每选择一个那么我们就会增加一个元素，而前面经过后就会消除掉。
2023-05-28 23:35:58
3514
27
原创 二次元的登录界面
大家可以尝试敲一敲，这样一步步就会了解到这种类型的布局，然后自己在尝试几次就可以自己来写自己的专属登录界面然后后期通过js完善一下会更加完美哦！今天还是继续坚持写博客，然后今天给大家带来比较具有二次元风格的登录界面，也只是用html和css来写的，大家可以来看看！和密码，它会提示你什么地方输入用户名，什么地方输入密码，这个就是使用的placeholder属性。还是设置一个背景颜色，这里我们使用的是渐变色：然后在需要让盒子来正中间，需要使用弹性布局。座右铭：懒惰受到的惩罚不仅仅是自己的失败，还有别人的成功。
2023-05-28 00:17:40
58214
152
原创 使用JS来实现回车评论功能
意思是显示文本中的内容，然后最后等我们按下回车结束后，就得清空文本域，所以我们的tx的最后得为空，然后发现我们下面的没有复原，这时候我们还需要加total.innerHtml='0/200字'才能复原成之后的样子。这里的keyup是最新版语法已经淘汰之前的keycoad，意思是键盘弹出事件，然后这里的e在keyup里面是回车的意思，所以要写在方法里面。然后我们来写文本焦点：tx这个文本域制作一个事件，这个事件是获得焦点，让下面的0/200字的文字显示出来。//等我们按下回车，结束后，清空文本域。
2023-05-26 20:55:47
2939
35
原创 使用JS来实现轮播图的效果
第一步我们先获取三个元素，toggle()是一个方法调用，我是把左边和右边的写在一个方法，显示更加美观，，然后呢我们执行右侧按钮业务，还是先获取右侧按钮，然后定义一个信息量i=0。3，最后讲一个功能，这里我们依旧是在定时器上面声明一个变量，因为我们定时器也是有一直在懂，所以我们来这块设定一个点击事件。但是当我们轮播图到了最后一个，需要往返第一个，这时候我们需要判断，如果到了素组下标为8的时候，我们就得返回第一个。第一个是鼠标经过停止事件，第二个是开始事件，这样呢我们一个完整的轮播图就做出来了。
2023-05-25 15:01:21
6930
17
原创 使用JS来实现随机点名的效果
addEventListene是监听事件的按钮，然后后面的click是事件，就是点击这个按钮就会执行下面的随机数的方法。clearInterva：关闭定时器的意思，因为我们做一个点名事件是需要通过定时器来完成，这里的意思是停止的意思。这里的意思是这个素组如果只剩下一个元素，那么就会禁用开始和停止这两个按钮，如果换是flase就可以继续使用。const arr = ['马超', '黄忠', '赵云', '关羽', '张飞']这里我们在这里写一个timeid是指这个事件的按钮，所以我们要在首页去定义二个变量。
2023-05-24 22:06:37
1910
17
原创 使用CSS来实现爱心信封的效果
就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。下面还是放一个盒子名字叫card-inside，下面在放一个盒子叫text-one，里面放我们想写的内容，比如标题写h1 h2写内容。想必在520大家都和女朋友过了完美的节日，可是博主还没有女朋友鹅鹅鹅，还是写一个爱心信封来维护自己弱小的心灵吧鹅鹅鹅。input：是表单标签，文本框的意思，类型是文本框里面的类型是什么类型。座右铭：懒惰受到的惩罚不仅仅是自己的失败，还有别人的成功。大家也可以尝试一下，下期再来分享好玩的程序哦。
2023-05-23 17:21:41
932
12
原创 使用JS来制作轮播图定时器
这个意思就是我们可以使用 document.getElementById(‘ xx ’).innerHTML 来获取指定标签内的html内容这个[i]的意思是素组的下标，因为是动态，所以我们得写i，不能写死。删除之后我们也还需要一个小圆点我们就用到了add是添加的意思，然后我们这个毕竟是轮播图，我们从第一个需要增加，所以我们这里用模板字符串$i+1,JS最新的ES6语法模板字符串。if函数是判断语句，我们这块的意思是如果我们的i已经到了最后一张，那么数组长度就是八，然后会返回来1，这一步必不可少。
2023-05-18 20:23:20
1344
5
原创 原来CSS的登录界面可以变得这么好看
素材是封面，大家可以来试试敲一下，因为很多都是基础知识，我相信大家也懂，不懂的话可以去看黑马pink老师讲的，学完后再看就理解很多了。<input type="password" placeholder="密码"><input type="text" placeholder="账号">毕竟是一个简单的登录界面，架构没有很复杂，自己都可以写的出来！座右铭：懒惰受到的惩罚不仅仅是自己的失败，还有别人的成功。接下来就是CSS界面，我们使用CSS来实现这个美丽的界面。感觉非常好看的，接下来还是来写我们的架构。
2023-05-17 09:54:10
5188
2
原创 今日的CSS小案例
P0 和 P3 是曲线的起点和终点，在 CSS 中，这两个点是固定的，因为坐标是成比例。P0 为 (0, 0)，代表初始时间和初始状态，P3 为 (1, 1)，代表最终时间和最终状态。今天需要做的是原神的手风琴，看其他挺好玩，我就做了一个，现在还是把展示图放出来吧哈哈，因为本人也是个二次元LSP。<h4>雷电将军</h4><h4>纳西妲</h4><h4>芭芭拉</h4><h4>凝光</h4><h4>多莉</h4><h4>刻晴</h4><h4>七七</h4><h4>可莉</h4>
2023-05-16 13:27:30
2268
27
原创 使用CSS来写一个响应式表格
可以选择你想选择的目标，比如我们要选择第一个，那么就是nth：child-first，最后一个是last。并集我想大家都知道，那么我们就来讲nth：child选择器，这个是CSS3新推出的一个选择器。也可以根据我们意愿来选择，如果你想选择第5个，那么就写五，既可以写数字也可以写字母。但是字母必须是n，也可以根据不同的用法来写详细请看W3c的文章。座右铭：懒惰受到的惩罚不仅仅是自己的失败，还有别人的成功。然后我们设置顶部的架构，这边我们是使用表单来写。接下俩我们设置表单主体。
2023-05-15 23:11:58
506
6
原创 使用CSS3动画做了四个小案例
box-shadow: none | inset（可选值，不设置，为外投影，设置，为内投影） x-offset（阴影水平偏移量，正方向为right） y-offset（阴影垂直偏移量，正方向为bottom） blur-然后我们可以来设置她的高可以使用vh，(是指可视窗口的高度。3. Y-offset:是指阴影的垂直偏移量，其值也可以是正负值，正值，阴影在对象的底部，负值时，阴影在对象的顶部。2.X-offset:是指阴影水平偏移量,其值可正可负，正值，则阴影在对象的右边，负值，阴影在对象的左边。
2023-05-14 11:18:58
1411
8
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人