![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
Flora_M
这个作者很懒,什么都没留下…
展开
-
js输出[object Object]
问题描述:在页面上使用了ant design的分页组件,展示总条数为共多少条,在这里展示时使用了模板字符串(``),即部分代码如下: <a-pagination class="myPagination" :total="total" :show-total="total => `共 ${total} 条`" />但是在接口返回数据时,如果未返回任何有效数据,接口返回了空对象,这时页面展示为共[object Object]条问题分析如果模.原创 2021-10-15 16:30:47 · 1862 阅读 · 0 评论 -
es6 常用知识点汇总
一、箭头函数写法一个参数,只包含一个表达式x => x * x一个参数,包含多条语句x => { if (x > 0) { return x * x; } else { return - x * x; }}两个参数(多参数需带括号)(x, y) => x * x + y * y无参数(无参数也要写括号)() => 3.14可变参数(x, y, ...rest) => {原创 2021-10-09 15:00:06 · 264 阅读 · 0 评论 -
Uncaught TypeError: document.registerElement is not a function at Object.UI.registerCustomElement
谷歌浏览器报错:Uncaught TypeError: document.registerElement is not a function at Object.UI.registerCustomElement (shell.js:3109)原因:谷歌浏览器版本兼容问题, document.registerElement 特性在谷歌80版本下是支持的,但是在80版本之上不支持,所以下载谷歌低版本就能解决该问题。...原创 2021-09-23 11:45:41 · 1104 阅读 · 0 评论 -
减少重绘和重排(重流)
1. 最小化重绘和重流由于重绘和重排代价可能较为昂贵,因此最好可以减少它的发生次数。可以合并多次对dom和样式的修改,然后一次处理掉。例如const el = document.getElementById(‘test’);el.style.padding = ‘5px’;el.style.borderLeft = ‘1px’;el.style.borderRight = ‘2px’;该例中有3个样式属性被修改了,那么可以采取合并所有的改变然后一次处理。※ 方案一:使用cssText(设置原创 2020-12-21 15:54:04 · 677 阅读 · 0 评论 -
原生js实现轮播图详解全
一、原理:每次只显示一张图片,其余隐藏。通过计算偏移量利用定时器实现自动播放,或通过手动点击事件切换图片。二、实现:给最外面的div容器固定的宽高,使内部的ul和li与div宽高相同(height:100%;width:100%),设置overflow:hidden,只显示一张图片为了实现无缝切换效果,利用两张辅助图填补最后一张图切换到第一张图时的空白。即复制最后一张图片放置在第一张图片前,同时复制第一张图片放置在最后一张图片的后面。让内部的ul强制不换行(white-space: nowrap;原创 2020-12-03 15:58:03 · 1039 阅读 · 1 评论 -
css实现左右宽度固定,中间自适应及上下宽度固定,中间自适应的方法
文章目录一、左右宽度固定,中间宽度自适应1. 使用浮动布局2. 使用弹性布局3. 使用绝对定位二、实现上下宽度固定,中间自适应1. 绝对定位2. flex弹性布局一、左右宽度固定,中间宽度自适应1. 使用浮动布局(1)左侧元素与右侧元素优先渲染,分别向左和向右浮动(2)中间元素在文档流的最后渲染,则会自动插入到左右两列元素的中间2. 使用弹性布局父元素开启flex,中间设置flex:13. 使用绝对定位二、实现上下宽度固定,中间自适应1. 绝对定位 <head> &原创 2020-12-01 21:24:40 · 908 阅读 · 0 评论 -
关于p、h标签嵌套问题、嵌套规则汇总
实例1:p标签2层嵌套效果如下:文字正常显示,但是dom却和想象的不一样。个人理解是如果p标签后面没有跟结束标签则会自动补上结束标签,而如果p标签和结束标签正好配对,则不发生改变,但是如果只有结束标签,则会自动配上开始标签。实例2:p标签3层嵌套实例3: h标签嵌套问题分析:h标签并没有和p标签一样有多余的空标签对,而是把结束标签提前了,与开始标签配对。实例4:p标签和h标签互相嵌套...原创 2020-10-05 15:22:42 · 6891 阅读 · 0 评论 -
浏览器对象及层次关系
一、window对象功能: 顶层对象(根对象),用来表示浏览器所打开的窗口书写格式:(1)正常书写: 窗口.属性 / 窗口.方法();(2)子窗口: opener.属性 / opener.方法();(3)框架: top.属性 / top.方法();(4)当前窗口: self.属性 / self.方法(); self也可以写成window常见属性:- name 窗口的名字.- closed 判断窗口是否己经被关闭,返回布尔值-转载 2020-10-04 21:17:44 · 1428 阅读 · 0 评论 -
html基础重点总结
文章目录1.代码的书写顺序2.关于浮动3.关于居中4.关于定位1.代码的书写顺序板块(框架)→有效区→具体内容→样式2.关于浮动一但元素加了float语句,则要跟着写clear语句(因为浮动之后父级的高度就会丢失掉,加上clear就可以把父级丢失掉的高度找回来)、代码:<div class="clear"></div>样式:.clear{ clear: both;}3.关于居中div居中:margin: 0 auto;4.关于定位一般是子元素相对原创 2020-05-27 18:27:13 · 491 阅读 · 0 评论 -
页面添加锚点的方式
1、给锚点文本标签添加id,使用<a href="#"></a>来定位,当单击a链接时,就会跳到id为a01的p标签处;<div> <a href="#a01"></a></div><p>练习</p><p id="a01">练习</p><p>练习...原创 2019-07-25 19:59:55 · 514 阅读 · 0 评论 -
浮动定位——布局
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; margin: 0...原创 2019-07-17 16:34:51 · 167 阅读 · 0 评论 -
照片墙——浮动定位
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { padding: 0; margin: 0; } body { ...原创 2019-07-17 15:03:56 · 1152 阅读 · 0 评论 -
水土项目总结
1.无论文件还是图片命名时用英文2.当不同的人一起做一个项目时,当改变某一个类的样式时,一定要重新起一个类名3.把word文件转为网页:文件另存为“网页”格式。4.超链接可以放pdf,网页、word等。5.内容添加滚动栏:overflow:scroll;...原创 2019-04-02 20:41:58 · 165 阅读 · 0 评论 -
前端随笔小结
1.如果想让两个div在一行的话,可以用display:inline-block;inline或float:left2.clear属性:指定段落的左侧或右侧不允许浮动的元素。取消浮动可以用clear:both;3.外面是一个div大框,作为父元素,里面是不同小框div作为子元素:想实现小框排在一行的话可以在父元素中使用display:flex,则在子元素中会默认排在一行。 位置问...原创 2018-10-08 19:43:20 · 203 阅读 · 0 评论