学习记录：2023.4.26

news/2024/5/2 5:47:28/文章来源:https://blog.csdn.net/jwhshsna/article/details/130386237

2023.4.26 实习学习记录

  • vue
  • Java基础
  • 框架

vue

  • 根据事件变换样式
 :style="scrollState? 'background-color: #fff;border-bottom:1px solid #e1e1e1': ' '  "

定义scrollState变量为true或false两个变量值，以上语句用于标签中，用于根据scrollState的值来设置样式
  • 设置方法，在一个页面时，点击展示相应的数据到窗口
<li @click="contractMarket()" :class="scrollState?'lightModel':''" >联系我们</li>
<li @click="gotoShowConsumer()" :class="scrollState?'lightModel':''" >服务客户</li>
<li @click="gotoShowFeatures()" :class="scrollState?'lightModel':''" >核心功能</li>
<li @click="getoShowProduct()" :class="scrollState?'lightModel':''" >产品介绍</li>
  • 锚点设置：scrollIntoView()方法将调用它的元素滚动到浏览器窗口的可见区域。详解
methods:{gotoShowConsumer(){//getElementById()：返回对拥有指定id的第一个对象的引用；//scrollIntoView()：滚动到浏览器窗口的可见区域。//展示“服务客户”页面到窗口document.getElementById("login_consumer_bg").scrollIntoView();},gotoShowFeatures(){document.getElementById("features").scrollIntoView();},getoShowProduct(){document.getElementById("whole").scrollIntoView();},contractMarket(){this.closeModel();document.getElementById("contract").scrollIntoView();}
}
  • sessionStorage.getItem(string key) ：返回键名(key)对应的值(value)。若没有返回null。
  • getElementById getxxxByxxx获取的是动态集合
    • getElementById() 方法可以在 HTML 文档中通过元素的 id 来获取该元素。它返回的是找到的第一个元素。
    • getElementsByName()：返回带有指定名称name的对象的集合。返回的是元素的数组，而不是一个元素（由于name不唯一）
    • getElementsByTagName()：返回带有指定标签名的对象集合
    • 具体详解
  • document.body.scrollTop用法
    • 网页可见区域宽： document.body.clientWidth;
    • 网页可见区域高： document.body.clientHeight;
    • 网页可见区域宽： document.body.offsetWidth (包括边线的宽);
    • 网页可见区域高： document.body.offsetHeight (包括边线的宽);
    • 网页正文全文宽： document.body.scrollWidth;
    • 网页正文全文高： document.body.scrollHeight;
    • 网页被卷去的高： document.body.scrollTop;
    • 网页被卷去的左： document.body.scrollLeft;
    • 网页正文部分上： window.screenTop;
    • 网页正文部分左： window.screenLeft;
    • 屏幕分辨率的高： window.screen.height;
    • 屏幕分辨率的宽： window.screen.width;
    • 屏幕可用工作区高度： window.screen.availHeight;
    • 屏幕可用工作区宽度：window.screen.availWidth;
    • scrollHeight 获取对象的滚动高度。
    • scrollLeft 设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
    • scrollTop 设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
    • scrollWidth 获取对象的滚动宽度
    • offsetHeight 获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度
    • offsetLeft 获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置
    • offsetTop 获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置
    • event.clientX 相对文档的水平座标
    • event.clientY 相对文档的垂直座标
    • event.offsetX 相对容器的水平坐标
    • event.offsetY 相对容器的垂直坐标
    • document.documentElement.scrollTop 垂直方向滚动的值
    • event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

要获取当前页面的滚动条纵坐标位置，用：document.documentElement.scrollTop;
而不是：document.body.scrollTop;
documentElement 对应的是 html 标签，而 body 对应的是 body 标签

handleScroll(){//window.pageYOffset = document.documentElement.scrollTop：前者为IE9及以上支持，后者为IE低版本支持；为了浏览器的兼容性//返回文档当前沿垂直轴（即向上或向下）滚动的像素数，默认值为0.0；其值为0.0时，表示该Document的顶部边缘当前与窗口内容区域的顶部边缘对齐。//document.body.scrollTop：网页被卷去的高，为0时，说明网页在顶端，没有下滑let scrollTop = window.pageYOffset || document.documentElement.scrollTop|| document.body.scrollTop;//页面没有下滑，scrollState用来判断用哪个样式  行号：13-16if(scrollTop!=0){this.scrollState=true;}else{this.scrollState=false;}
}

  • created和mounted的区别

  • vue.js中的生命周期，如果不是有特别的需求，一般在项目开发过程中更多的使用created和mounted。

  • created阶段：在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。执行created生命周期函数，当这个函数执行的时候，我们已经可以拿到data下的数据以及methods下的方法了，所以在这里，我们可以开始调用方法进行数据请求了

  • mounted阶段：在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。调用mounted，并将标识生命周期的一个属性_isMounted 置为true。所以mounted函数内，我们是可以操作dom的，因为这个时候dom已经渲染完成了
    详解

  • sessionStorage的用法：

  • string sessionStorage.key(int index) ：返回当前 sessionStorage 对象的第index序号的key名称。若没有返回null。

  • 方法 string sessionStorage.getItem(string key) ：返回键名(key)对应的值(value)。若没有返回null。

  • 方法 void sessionStorage.setItem(string key, string value) ：该方法接受一个键名(key)和值(value)作为参数，将键值对添加到存储中；如果键名存在，则更新其对应的值。

  • 方法 void sessionStorage.removeItem(string key) ：将指定的键名(key)从 sessionStorage 对象中移除。

  • 方法 void sessionStorage.clear() ：清除 sessionStorage 对象所有的项。
    具体详解

  • v-if和v-show的区别：

    • 首先了解一下生命周期：每一个vue实例从创建到销毁的过程，就是这个vue实例的生命周期。在这个过程中，他经历了从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程。（
    • v-show严格意义来说其实是条件隐藏，直接在页面初始化的时候将DOM(对象模型)元素也初始化，因为它就是将它所在的元素添加一个display属性为none，如果条件符合就显示。
    • v-if严格意义来说就是条件判断，符合就加载DOM(对象模型)元素，不符合就不显示。
    • v-if每切换一次就要重新走一次生命周期，比如说重新构建内部事件和函数。
    • v-show则就是页面初始时走一遍生命周期，将其加载完毕，其他时候则都不会走相关的周期了。
    • v-if有更高的切换性能，比如说需要判断多个条件时，就使用if。
    • 如果需要频繁的切换，选择v-show，因为show是动态的改变样式，不需要增删DOM(对象模型)元素，大项目推荐使用show，能极大减少浏览器后期的操作性能。
    • show不支持语法。

  • this.$nextTick作用：在下次dom更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获得更新后的dom。

  • == 和 = = = 的区别

    • == 用来比较或者判断两者是否相等，比较时可以自动转换数据类型
    • === 用来较为严格的比较，除判断数据2这是否相等 ，还会判断两者数据类型是否相同 如不相同也不会转换数据类型 。返回（false）

  • ECharts的init()方法

mounted() {//this.$nextTick作用：在下次dom更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获得更新后的dom。this.$nextTick(() => {//修改资产规模的数据this.finialEcharts();});this.map_charts = echarts.init(document.getElementById("map"));
},

Java基础

  • 反射：JAVA反射机制是在运行状态中，对于任意一个类，都能够知道这个类的所有属性和方法；对于任意一个对象，都能够调用它的任意一个方法和属性；这种动态获取的信息以及动态调用对象的方法的功能称为java语言的反射机制。要想解剖一个类,必须先要获取到该类的字节码文件对象。而解剖使用的就是Class类中的方法.所以先要获取到每一个字节码文件对应的Class类型的对象.
    • 反射就是把java类中的各种成分映射成一个个的Java对象：一个类有：成员变量、方法、构造方法、包等等信息，利用反射技术可以对一个类进行解剖，把个个组成部分映射成一个个对象。
    详情

框架

  • Spring创建Bean的几种方式：
    • 通过xml配置
    • 通过@Configuration注解
    • 通过@Component注解
    • 通过Import注解
  • BeanFactory和FactoryBean的区别：
    • BeanFactory是spring容器最基本的接口,他提供了spring容器的最基本方法,但是不提供具体的实现.日常我们用了spring容器就是DefaultListableBeanFactory,是BeanFactory的实现类.所以可以说BeanFactory就是spring容器,负责管理所有的bean.
    • FactoryBean是一个Bean,也可以用来创建Bean,他为我们提供了一个更灵活的创建Bean的方法.Factory产生的bean也是要交给spring容器管理的.

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.luyixian.cn/news_show_294384.aspx

如若内容造成侵权/违法违规/事实不符，请联系dt猫网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

AI模型推理（１）——入门篇

AI模型推理（１）——入门篇

前言 本文主要介绍AI模型推理的相关基础概念&#xff0c;为后续云原生模型推理服务的学习做准备。 初识模型部署 对于深度学习模型来说&#xff0c;模型部署指让训练好的模型在特定环境中运行的过程。相比于常规的软件部署&#xff0c;模型部署会面临更多的难题&#xff1a; …
阅读更多...
JavaScript 内存泄漏

JavaScript 内存泄漏

内存的释放流程&#xff1a; 分配内存内存中的读写垃圾回收 对于内存的使用&#xff0c;所有语言基本都是一样的&#xff0c;只是更底层的语言在对于 ”分配内存“ 和 ”使用内存“ 是明确的&#xff0c;但是在高级语言中&#xff08;比如本文的 JS&#xff09;是隐藏了。 JS …
阅读更多...
五一堵车 | AI“高速”车辆检测轻而易举监测大家安全

五一堵车 | AI“高速”车辆检测轻而易举监测大家安全

点击蓝字关注我们 关注并星标 从此不迷路 计算机视觉研究院 学习群&#xff5c;扫码在主页获取加入方式 计算机视觉研究院专栏 作者&#xff1a;Edison_G 五一节不管是离开小城镇还是进入大城市&#xff0c;每个高速路口都是堵车&#xff0c;现在人工智能愈来愈发达&#xff0c…
阅读更多...
4月30日第壹简报，星期日，农历三月十一

4月30日第壹简报，星期日，农历三月十一

4月30日第壹简报&#xff0c;星期日&#xff0c;农历三月十一坚持阅读&#xff0c;静待花开1. 五一小长假首日全国铁路迎客流高峰&#xff0c;创铁路单日客流历史新高&#xff0c;旅游订单量较春节假期首日增长668%。2. 六大国有银行一季报业绩披露&#xff1a;共赚近3600亿元&…
阅读更多...
K8s基础1——发展起源、资源对象、集群架构

K8s基础1——发展起源、资源对象、集群架构

文章目录 一、发展起源二、资源对象2.1 集群类2.2 应用类2.3 存储类2.4 安全类 三、集群架构 一、发展起源 K8s官方文档 K8s怎么来的&#xff1f; 十几年来&#xff0c;谷歌内部使用的大规模集群管理系统是Brog&#xff0c;基于容器技术实现了资源管理的自动化和跨多个数据中心…
阅读更多...
一曲微茫度余生 ——川剧《李亚仙》唱响香港西九戏曲中心

一曲微茫度余生 ——川剧《李亚仙》唱响香港西九戏曲中心

2023年4月28日晚&#xff0c;香港西九戏曲中心灯火辉煌。重庆市川剧院携手成都市川剧研究院带来的川剧《李亚仙》首场演出在这个为戏曲而设的世界级舞台重磅上演。 此次访演受香港西九戏曲文化中心的邀请&#xff0c;原重庆市文化和旅游发展委员会党委书记、主任刘旗带队&…
阅读更多...
CKA/CKS/CKAD认证考试攻略

CKA/CKS/CKAD认证考试攻略

什么是CKA考试&#xff1f; CKA认证考试是由Linux基金会和云原生计算基金会(CNCF)创建的&#xff0c;以促进Kubernetes生态系统的持续发展。该考试是一种远程在线、有监考、基于实操的认证考试&#xff0c;需要在运行Kubernetes的命令行中解决多个任务。CKA认证考试是专为Kube…
阅读更多...
SpringBoot 多数据源及事务解决方案

SpringBoot 多数据源及事务解决方案

1. 背景 一个主库和N个应用库的数据源&#xff0c;并且会同时操作主库和应用库的数据&#xff0c;需要解决以下两个问题&#xff1a; 如何动态管理多个数据源以及切换&#xff1f; 如何保证多数据源场景下的数据一致性(事务)&#xff1f; 本文主要探讨这两个问题的解决方案…
阅读更多...
使用Dino+SAM+Stable diffusion 自动进行图片的修改

使用Dino+SAM+Stable diffusion 自动进行图片的修改

SAM 是Mata发布的“Segment Anything Model”可以准确识别和提取图像中的对象。 它可以分割任何的图片&#xff0c;但是如果需要分割特定的物体&#xff0c;则需要需要点、框的特定提示才能准确分割图像。 所以本文将介绍一种称为 Grounding Dino 的技术来自动生成 SAM 进行分割…
阅读更多...
Linux学习[8]查找文件指令：which whereis locate find

Linux学习[8]查找文件指令：which whereis locate find

文章目录 前言1. which2. whereis3. locate4. find总结&#xff1a; 前言 之前在弄交叉编译的时候需要找到gcc&#xff0c;gdb什么的在哪里&#xff1b;涉及到了查找文件指令。 这里对linux中的查找指令进行总结 1. which which指令一般用来寻找可执行文件的路径&#xff0c;…
阅读更多...
AI绘画能力的起源：通俗理解VAE、扩散模型DDPM、ViT/Swin transformer

AI绘画能力的起源：通俗理解VAE、扩散模型DDPM、ViT/Swin transformer

前言 2018年我写过一篇博客&#xff0c;叫&#xff1a;《一文读懂目标检测&#xff1a;R-CNN、Fast R-CNN、Faster R-CNN、YOLO、SSD》&#xff0c;该文相当于梳理了2019年之前CV领域的典型视觉模型&#xff0c;比如 2014 R-CNN2015 Fast R-CNN、Faster R-CNN2016 YOLO、SSD2…
阅读更多...
5 款 AI 老照片修复工具的横向比较

5 款 AI 老照片修复工具的横向比较

在大语言模型和各类 AI 应用日新月异的今天&#xff0c;我终于下定决心&#xff0c;趁着老照片们还没有完全发黄褪色、受潮粘连抑或损坏遗失&#xff0c;将上一代人实体相册里的纸质胶卷照片全部数字化&#xff0c;并进行一次彻底的 AI 修复&#xff0c;好让这些珍贵的记忆能更…
阅读更多...
【五一创作】数据可视化之美 ( 三 ) - 动图展示 ( Python Matlab )

【五一创作】数据可视化之美 ( 三 ) - 动图展示 ( Python Matlab )

1 Introduction 在我们科研学习、工作生产中&#xff0c;将数据完美展现出来尤为重要。 数据可视化是以数据为视角&#xff0c;探索世界。我们真正想要的是 — 数据视觉&#xff0c;以数据为工具&#xff0c;以可视化为手段&#xff0c;目的是描述真实&#xff0c;探索世界。 …
阅读更多...
利用倾斜摄影超大场景的三维模型轻量化技术如何提高网络传输的效率？

利用倾斜摄影超大场景的三维模型轻量化技术如何提高网络传输的效率？

利用倾斜摄影超大场景的三维模型轻量化技术如何提高网络传输的效率&#xff1f; 倾斜摄影超大场景的三维模型轻量化在网络传输中的效率可以通过以下几个方面进行提高&#xff1a; 一、数据压缩 对于倾斜摄影超大场景的三维模型数据&#xff0c;可以采用数据轻量化压缩技术进…
阅读更多...
Spring DI简介及依赖注入方式和依赖注入类型

Spring DI简介及依赖注入方式和依赖注入类型

目录 一、什么是依赖注入 二、依赖注入方式 1. Setter注入 2. 构造方法注入 3. 自动注入 三、依赖注入类型 1. 注入bean类型 2. 注入基本数据类型 3. 注入List集合 4. 注入Set集合 5. 注入Map集合 6. 注入Properties对象 往期专栏&文章相关导读 1. Maven系…
阅读更多...
项目管理软件可以用来做什么？这篇文章说清楚了

项目管理软件可以用来做什么？这篇文章说清楚了

项目管理软件是用来干嘛的&#xff0c;就得看对项目的理解。项目是为创造独特的产品、服务或成果而进行的临时性工作。建造一座大楼可以是一个项目&#xff0c;进行一次旅游活动、日常办公活动、期末考试复习等也都可以看成一个项目。 项目管理不善会导致项目超时、超支、返工、…
阅读更多...
『python爬虫』05. requests模块入门（保姆级图文）

『python爬虫』05. requests模块入门（保姆级图文）

目录 安装requests1. 抓取搜狗搜索内容 requests.get2. 抓取百度翻译数据 requests.post3. 豆瓣电影喜剧榜首爬取4. 关于请求头和关闭request连接总结 欢迎关注 『python爬虫』 专栏&#xff0c;持续更新中 欢迎关注 『python爬虫』 专栏&#xff0c;持续更新中 安装requests …
阅读更多...
【Linux】4. 开发工具的使用(yum/vim)

【Linux】4. 开发工具的使用(yum/vim)

前言 工具的本质就是指令 在介绍工具之前先介绍一下互联网生态 Linux 软件包管理器 yum 1. 什么是软件包 在Linux下安装软件, 一个通常的办法是下载到程序的源代码, 并进行编译, 得到可执行程序. 但是这样太麻烦了, 于是有些人把一些常用的软件提前编译好, 做成软件包(可以…
阅读更多...
SQL(基础)

SQL(基础)

DDL: 数据定义语言 Definition&#xff0c;用来定义数据库对象&#xff08;数据库、表、字段&#xff09;CREATE、DROP、ALTER DML: 数据操作语言 Manipulation&#xff0c;用来对数据库表中的数据进行增删改 INSERT、UPDATE、DELETE 注意&#xff1a; DDL是改变表的结构 DML…
阅读更多...
享受简单上传体验：将Maven仓库迁移到GitHub

享受简单上传体验：将Maven仓库迁移到GitHub

前言&#xff1a;我为什么放弃了Maven Central 之前我写过一篇《Android手把手&#xff0c;发布开源组件至 MavenCentral仓库》&#xff0c;文中详细介绍了如何发布组件到Maven Central中供所有开发者共用。但是最近使用下来&#xff0c;发现Sonatype JIRA 的Maven Center上传…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站 广利置业