前端入门
文章平均质量分 67
隐藏用户y
一切从0开始
展开
-
Vue监视数据的学习笔记
Vue会监视data中所有层次的数据如何监测对象中的数据通过setter实现监视,且要在new Vue时就要传入要监测的数据(1). 对象中后追加的属性,Vue默认不做响应式处理(2). 如需给后添加的属性做响应式,请使用如下API:Vue.set(target,propertyName/index,value)或如何监测数组中的数据?通过包裹数组更新元素的方法实现,本质两步骤(1).调用原生对应的方法对数组进行更新(2).重新解析模板,进而更新页面。原创 2023-04-23 15:45:06 · 584 阅读 · 0 评论 -
JS阻止事件冒泡的方法*基础原理与运用
JS阻止事件冒泡的方法*基础原理与运用原创 2023-01-02 22:56:45 · 545 阅读 · 0 评论 -
JavaScript-BOM
💖通过看视频教程和红宝书浅浅的写下一些关于BOM的笔记红宝书知识系统全面,精炼。大概是因为太干货了,涉及的知识点太多,所以我选择看着简单的视频教程,同时打开红宝书。笔记的内容以红宝书为基准。原创 2022-12-16 09:46:00 · 251 阅读 · 0 评论 -
JavaScript-DOM操作表单
声明一个数组,遍历checkbox,如果checkbox被选中就将此checkbox的内容push到数组中。事件需要有动作才可以实行(比如点击触发,方法可以不用动作,调用即可)代码中给每个表单添加了name属性,用这个属性去获取相应的表单元素。checkbox(兴趣) 的值没有成功获取到。注意:onsubmit,onreset只能给表单添加。表单.submit;表单.onreset;可以通过form.name获取表单。checkbox的获取办法。checkbox的获取办法。全文使用代码完整如下。原创 2022-12-13 11:32:42 · 319 阅读 · 0 评论 -
JavaScript-DOM操作表格
DOM操作表格会在项目做数据展示的时候用到,其余地方使用并不多。表格中的tbody是可以不写的,在浏览器解析的时候,会自动加上建议写的时候写上tbody,向项目标准看齐。原创 2022-12-09 20:46:09 · 474 阅读 · 0 评论 -
HTML DOM Element 对象(getBoundingClientRect,getAttribute,setAttribute,removeAttribute)
获取到元素盒模型的一些信息,得到的结果是没有单位的,不包含滚动条的距离,不包含margin,包含border和paddingwidth 宽度(包含边框)height 高度(包含边框)left 从元素最左边到可视区最左边距离从元素最右边到可视区最左边距离top 从元素的最上边到可视区最上边的距离从元素的最下边到可视区最上边的距离给body添加一个高度的样式,从而出现滚动条,但是对盒子无影响。原创 2022-12-09 20:16:37 · 126 阅读 · 0 评论 -
JavaScript-innerHtml与DOM方法的区别
此时运行点击任意一个,弹框显示undefined,为什么呢,因为html是大写的取消注释的内容,点击事件失效。如果考虑使用innerHTML,要考虑之前的事件会不会失效。原创 2022-12-09 19:43:00 · 133 阅读 · 0 评论 -
HTML DOM Element 对象(getBoundingClientRect,getAttribute,setAttribute,removeAttribute)
获取到元素盒模型的一些信息,得到的结果是没有单位的,不包含滚动条的距离width 宽度(包含边框)height 高度(包含边框)left 从元素最左边到可视区最左边距离从元素最右边到可视区最左边距离top 从元素的最上边到可视区最上边的距离从元素的最下边到可视区最上边的距离···。原创 2022-12-09 19:33:54 · 102 阅读 · 0 评论 -
JavaScript-DOM 操作方法的特性
}原创 2022-12-09 15:18:23 · 374 阅读 · 0 评论 -
JavaScript实现登录框定位
元素.offsetWidth返回元素的宽度,包含边框的元素.clientWidth返回元素的宽度,不包含边框的元素.clientHeight和宽度语法相同可视区的宽高宽:document.documentElement.clientWidth高:document.documentElement.clientHeight。原创 2022-11-30 22:18:49 · 402 阅读 · 0 评论 -
JavaScript获取DOM元素相关信息和属性
获取到元素盒模型的一些信息,得到的结果是没有单位的,不包含滚动条的距离,不包含margin,包含border和paddingwidth 宽度(包含边框)height 高度(包含边框)left 从元素最左边到可视区最左边距离从元素最右边到可视区最左边距离top 从元素的最上边到可视区最上边的距离从元素的最下边到可视区最上边的距离给body添加一个高度的样式,从而出现滚动条,但是对盒子无影响。原创 2022-11-29 22:11:04 · 1088 阅读 · 0 评论 -
认识与了解前端Dom
文档对象模型Dom是关于创建,修改,插入,删除页面元素的标准Dom赋予我们操作操作页面的能力页面的内容都是字符串,js会把这些字符串转换成DOM树,DOM树会把字符串转换成节点,其实我们操作DOM的根本就是操作节点。原创 2022-11-29 16:50:31 · 291 阅读 · 0 评论 -
js文字提示层案例分析
在一段文本中鼠标触及红色字体,下方显示一个文字提示信息,鼠标离开红色字体区域,文字提示层消失。原创 2022-11-29 16:32:51 · 548 阅读 · 0 评论 -
JavaScript倒计时
JavaScript倒计时经典案例,最后希望我们每个人都可以按照自己喜欢的方式过好一生。原创 2022-11-13 15:26:54 · 320 阅读 · 0 评论 -
JavaScript历史上的今天是星期几
历史上的今天是星期几javascript代码详细解析。原创 2022-11-15 18:11:04 · 408 阅读 · 0 评论 -
*JavaScript*计算这个月的天数&这个月第一天星期几&今天是今年的第几周
原因:如果今天的星期比今年的第一天的星期小,就会少一周。因为不断减带最后的话,会跳到上一年,这个时候while的条件不满足,n就会少加一次。取到今年的第一天的星期,取今天的星期。两个值对比,如果今天的星期比今年的第一天的星期要小,就让n再加个1.运行结果与百度结果相同。原创 2022-11-12 18:20:36 · 731 阅读 · 0 评论 -
JavaScript:日期对象
JavaScript:日期对象的内容和运用原创 2022-11-12 16:21:05 · 490 阅读 · 0 评论 -
js运动例子-无缝滚动
本文引用的move.js我在GitHub上面找到了下载了压缩包引入的但是代码的内容并不是我想要的。不知道是我没有找对文件还是什么原因,后期找到会来更新。假设3张图片,复制一倍,在第6张图片展现之后瞬间拉回第一张,无缝滚动只能一行显示。如果图片不一行展示换行的话,就不是无缝了。滚动的是ul整体不是单张图片。原创 2022-11-12 00:09:30 · 273 阅读 · 0 评论 -
定时器例子-下拉广告(setInterval和setTimeout的运用)
3.让div的高度从250变化到100(setInterval)1.让div的高度从0变成250(setInterval)2.到达指定的高度后需要停止3s(setTimeout)4.运动完成以后要清除定时器。原创 2022-11-09 23:41:02 · 84 阅读 · 0 评论 -
js运动雏形及其相关问题和运动框架
b是元素开始的位置,起点不一定在0,0,参数里的目标值是要运动到的那个点,而不是要走的距离。所以元素如果不在0,0开始运动的话,需要把起始点的距离加上。原因:因为每次运动开始都会清除上一个定时器,后面运动的时候清楚了前面的定时器,所以后面东前面不动了。第二个参数里面用的键值对的形式,值没有单位,opacity的值是0-1。限定时间的运动,根据时间去控制速度,已知时间和距离,计算速度。某个点的位置=总的距离/总的时间*(现在的时间-开始的时间)解决:使用自定义属性,只清除自己的定时器,不清楚别的定时器。原创 2022-11-11 21:15:57 · 246 阅读 · 0 评论 -
牛客刷题-CSS-02【浮动和清除浮动】
在非IE浏览器下,容器不设置高度,子元素浮动,容器不会被内容撑开,此时内容溢出到容器外面影响布局,这种现象就是浮动(溢出)。原创 2022-10-14 16:26:06 · 454 阅读 · 0 评论 -
牛客刷题-css-1
1.外部资源由元素表示,该元素可以被视为图像、嵌套的浏览上下文或插件要处理的资源。它包括各种属性,如存档、边框、分类、代码库、代码类型等。定义一个嵌入的对象。请使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数,以及可用来显示和操作数据的代码。用于包含对象,比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。object 的初衷是取代 img 和 applet 元素。原创 2022-10-12 22:27:47 · 278 阅读 · 0 评论 -
牛客刷题笔记-html-9
duration:规定造成过渡效果需要花费的时间 defaultPlaybackRate:设置或者返回音频或者视频播放的默认速度 PlaybackRate:设置或者返回视频当前的播放速度.4、Comment类型(注释节点)——有时我们可以将一些信息放入其中,它不会显示,但JS可以从DOM中读取它。1、Document类型(document节点)——DOM的“入口点”2、Element节点(元素节点)——HTML标签,树构建块。3、Text类型(文本节点)——包含文本。原创 2022-09-23 22:25:25 · 66 阅读 · 0 评论 -
js定时器
js中内置的一个方法。原创 2022-09-22 20:13:09 · 4957 阅读 · 0 评论 -
js预解析+闭包+垃圾回收机制
在当前作用域下,js运行之前,会把带有var和function关键字的事先声明,并在内存中安排好。然后再从上到下执行js语句。预解析只会发生在通过var定义的变量和function上。预解析题目练习。原创 2022-09-22 19:44:54 · 211 阅读 · 0 评论 -
牛客刷题笔记-html-8
这里的关键在于 display: inline-block 使得 C内部形成了BFC, BFC不与float元素重叠. 所以会出现在紧贴着a的右边界以及b的下边界的位置出现.那么C会直接和a重叠,虽然文本让出位置也就是c会出现在a的下边界下方. 但是高度仍然是100px.嵌套块元素的,但是有时由于特殊需要(可触区方面的考虑)以及语义性的考虑,会为a标签设置display:block;或float,再使用a标签嵌套块元素。在使用包含文件上传控件的表单时,必须使用该值。全局属性就是所有标签都可以使用的属性。原创 2022-09-21 22:11:34 · 279 阅读 · 0 评论 -
牛客刷题笔记-html-7
JSON 和 XML 优缺点的比较 (1)【XML】的优缺点 优点: (1)格式统一,符合标准;那么除了XML格式,还有一种叫JSON (2)【JSON】的优缺点 优点: (1)数据格式比较简单,易于读写,格式都是压缩的,占用带宽小;(4)在PHP世界,已经有PHP-JSON和JSON-PHP出现了,偏于PHP序列化后的程序直接调用,PHP服务器端的对象、数组等能直接生成JSON格式,便于客户端的访问提取;是source的缩写,是资源,页面必不可少的一部分,src指向的内容会嵌入到文档中当前标签的位置。原创 2022-09-20 11:43:12 · 92 阅读 · 0 评论 -
牛客刷题笔记-html-6
,这些元素的媒介规定外部文本轨道)原创 2022-09-19 16:40:34 · 97 阅读 · 0 评论 -
牛客刷题笔记-html-5
param 元素允许您为插入 XHTML 文档的对象规定 run-time 设置,也就是说,此标签可为包含它的 标签提供参数。3、语义化更好的内容标签(header,nav,footer ,aside, article, section)image 是通过对象的形式描述图片的,canvas 通过专门的 API 将图片绘制在画布上.突出显元素指定文本的重要性,mark 元素表示标记或高亮显示以供参考的文档中的文本。在 HTML5 中,拖放是标准的一部分,任何元素都能够拖放。原创 2022-09-18 10:37:50 · 133 阅读 · 0 评论 -
javascript作用域和作用域链
变量或函数在函数外面声明,就是全局变量和全局函数全局的作用范围是整个文档,在当前页面任何地方都可以访问。1.所有变量或函数在函数外面声明2.变量不用var声明,直接给变量赋值,不管是在函数内还是函数外声明。因为全局变量是window下的属性,window是一个全局对象,它本身在页面中任何位置都可以用,所以说全局变量可以在任何地方用。注意:尽量避免使用全局变量,声明变量一定要加var。全局变量存在于页面打开时,结束于页面关闭时。原创 2022-09-17 22:38:54 · 135 阅读 · 0 评论 -
html牛客刷题笔记-4
p标签内只能嵌套内联元素, 不能嵌套块元素 ,类似h1、div、ul块元素都不可自由嵌套在p标签内。ul标签中只能嵌套li标签,不能直接在ul中输入其它标签或文字。这道题没有找到合理的解释,目前没有浏览器支持 box-flex 属性。A.HTTP302状态码代表的意思是临时重定向,即 HTTP 302 Found 响应状态。HTTP 302 (Http Status Code 302) 状态是HTTP协议的一种响应码,是我们请求访问网站时,服务器端返回的3xx 重定向状态系列响应码之一。原创 2022-09-17 21:35:26 · 385 阅读 · 0 评论 -
html牛客刷题笔记-3
...原创 2022-09-16 15:46:26 · 202 阅读 · 0 评论 -
html牛客刷题笔记-2
父元素设置相对定位,子元素设置绝对定位,子元素的top值设置为50%(即父元素高度的50%),注意:此时是child元素的左上角(0,0),移到了parent元素的(0,parent高度的50%),而不是子元素的中心点移到了父元素垂直方向的中心点。A:把parent变成table,再把子元素变为table-cell,而vertical-align属性可以设置元素垂直对齐,前提条件:只能应用于内联元素以及display值为table-cell的元素。属性定义了元素的哪边的上方不允许出现浮动元素。原创 2022-09-15 16:33:17 · 108 阅读 · 0 评论 -
html牛客刷题笔记-1
也就是说页面装载后允许使用javascript脚本将该属性取消,取消后该元素变为可见状态,同时元素中的内容也即时显示出来。tabindex="0" ,表示元素是可聚焦的,并且可以通过键盘导航来聚焦到该元素,它的相对顺序是当前处于的 DOM 结构来决定的。initial-scale: viewport 的初始缩放级别(0-10之间的正数,1表示无缩放)tabindex=负值 (通常是 tabindex=“-1”),表示元素是可聚焦的,但是。父子嵌套元素垂直方向的 margin,父子元素是结合在一起的,原创 2022-09-14 22:36:20 · 180 阅读 · 0 评论 -
JavaScript的arguments对象
Rest parameters剩余参数,欲知后事如何,请听下回分解~这段代码使用arguments对象获取元素属性值和设置元素属性值。arguments可以用来获取元素的属性,也可以设置元素的属性。是一个对应于传递给函数的参数的类数组对象。来确定传递给函数参数的个数,然后使用。arguments简单应用。对象来处理每个参数。原创 2022-09-13 23:01:53 · 96 阅读 · 0 评论 -
回流与重绘
今天做了几道牛客html题目,有个题目涉及到了reflow和repaint,看了一些文章。觉得有趣,记录一下。不为被隐藏的对象保留其物理空间所占据的空间位置仍然存在,仅仅是视觉上的透明前者隐藏元素同时不保留空间,页面的布局大小元素位置会发生改变,引起reflow,repaint。后者隐藏元素保留空间,页面布局不变不会发生reflow,但是会发生repaint。因为页面布局大小改变,将会重新绘制发生改变的部分,但是某个元素发生外观颜色变化(发生重绘)不会影响布局结构,不会reflow。原创 2022-09-12 22:26:55 · 239 阅读 · 0 评论 -
js中break与continue和return关键字
不使用return默认返回值是undefined。为什么要用函数返回值方便函数复用。函数中return的实际应用。封装getStyle()函数。函数执行完成后都有返回值。原创 2022-07-26 13:42:17 · 92 阅读 · 0 评论 -
浅学js中的关系运算符
关系运算符会把结果转换成布尔值 ==比较的是两个值是否相同 ===首先比较两个值的类型,类型不同直接false;如果数据类型和值都相等,返回true!=两个值不相同返回true,相同返回false!==数据类型和值都不相同返回true总结:只有undefined和null相等。...原创 2022-07-13 14:56:56 · 117 阅读 · 0 评论 -
JavaScript制作简易计算器知识点剖析
前言:使用JavaScript制作一个计算器,使用到的知识点是 F5运行如图所示 页面中计算结果是字符串的拼接。不是想要的结果需要运用数据类型的转换。对象转换成这三种数据是没有意义的,因为对象里面可以放任意一种数据类型任意类型转数字(忽略代码不够优雅) 总结:Number(要转换的值) 把任意类型都转为数字parseInt() 把字符串转成整数型数字parseFloat() 把字符串转成浮点型(小数)数字传进来的字符串必须是空格加数字开头或者数字开头,从数字开原创 2022-07-12 14:45:09 · 822 阅读 · 0 评论 -
JavaScript中console.log()和console.dir()的区别
在学习JavaScript产生的一点点小问题,记录一下对象的浏览器实现,包含在浏览器自带的开发工具之中。方法用于在console窗口输出信息。它可以接受多个参数,将它们的结果连接起来输出。 方法会自动在每次输出的结尾,添加换行符。console.dir()可以显示一个对象所有的属性和方法。...原创 2022-07-10 15:36:24 · 396 阅读 · 2 评论