首页 > 其他分享 >前端知识点系列一

前端知识点系列一

时间:2023-02-28 20:33:49浏览次数:33  
标签:知识点 系列 属性 前端 元素 加载 用户 页面 图片


什么是同源:

源:如果两个页面的协议,端口和域名是相同的,则两个页面具有相同的源。
同源策略限制从一个源加载的文档或脚本与另一个不同的源的资源进行交互。
即一个页面不能调用另一个不同源中的脚本。(可以引用,例如src,但不能读写)

同源政策的目的,是为了保证用户信息的安全,防止恶意的网站窃取数据。如果非同源,共有三种行为受到限制。

  •  Cookie、LocalStorage 和 IndexDB 无法读取。
  •  DOM 无法获得。
  •  AJAX 请求不能发送。

性能优化? 

  • 使用 CDN
  • 图片懒加载
  • 使用外部 JavaScript 和 CSS
  • 压缩 JavaScript 、 CSS 、字体、图片等
  • 优化 CSS Sprite
  • 减少 HTTP 请求数
  • 减少 DNS 查询
  • 减少 DOM 元素数量
  • 减少 DOM 操作
  • 把脚本放在页面底部

一个页面上有大量的图片,加载很慢,你有哪些方法优化这些图片的加载,给用户更好的体验。

  •    图片懒加载,滚动到相应位置才加载图片。原理是这个可以用js监控滚动的位置,当初图片位置出现或者即将出现在可视区域时,进行加载。
  •    图片预加载,如果为幻灯片、相册等,将当前展示图片的前一张和后一张优先下载。
  •    使用CSSsprite,SVGsprite,Iconfont、Base64等技术,如果图片为css图片的话。
  •    如果图片过大,可以使用特殊编码的图片,加载时会先加载一张压缩的特别厉害的缩略图,以提高用户体验。

<label>标签为input元素定义标注(标记)

label元素不会向用户呈现任何特殊效果,不过,它为鼠标用户改进了可用性,如果您在label元素内点击文本,就会触发此控件。

就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上

<label>标签的for属性应当与相关元素的id属性相同

注意:for属性可把label绑定到另外一个元素,请把for属性的值设置为相关元素的id属性的值




标签:知识点,系列,属性,前端,元素,加载,用户,页面,图片
From: https://blog.51cto.com/u_15983333/6091777

相关文章

  • classList属性的知识点整理
    classLIst属性返回元素的类名,作为DOMTokenList对象该属性用于在元素中添加、移出、切换css类语法:elem.classList方法:add(String[,String]):添加指定的类值。如果这些类已经......
  • Luffy项目:3、前端调整(全局css、全局配置、全局axios...),后端主页轮播图表设计,接口部分
    目录Luffy项目一、luffy项目前端调整1、全局css2、全局配置文件3、安装axios4、安装vue-cookies5、安装elementui6、安装bootstrap和jq二、后端主页部分1、轮播图部分表设......
  • 路飞项目 - 前端准备
    目录路飞项目-前端准备1路飞前台全局css,全局配置文件1.1vue-cli创建项目,整理项目1.2全局css清理1.3全局js组件中发送url的两种方法(1)方法一:放到vue的原型中2axios放......
  • 拥抱下一代前端工具链-Vue老项目迁移Vite探索
    作者:京东物流邓道远背景描述随着项目的不断维护,代码越来越多,项目越来越大。调试代码的过程就变得极其痛苦,等待项目启动的时间也越来越长,尤其是需要处理紧急问题的时候,切......
  • KingbaseES V8R3 集群运维系列 -- 修改数据库服务端口
    ​案例说明:KingbaseESV8R3集群数据库服务端口(默认:54321)的配置在数据库及集群多个配置文件中都存在,修改端口需要更改所有的配置文件,本案例详细描述了数据库服务端口修改......
  • KingbaseES V8R6 运维系列 --单机小版本升级
    ​案例说明:在KingbaseESV8R6版本提供了sys_upgrade的升级工具,本案例描述了KingbaseESV8R6单机环境下数据库的小版本升级操作,案例涉及的版本从‘(Kingbase)V008R006C0......
  • 前端随笔0:URL与状态的双向绑定
    记录一些最近写前端的思考总结,也算是给自己的技术随笔开个篇在接触以React,Vue为代表的工程化前端框架前,我还是一个拿着jQuery手撸特效和手写CSS的切图仔,捣鼓Vue时......
  • 若依前端部署后地址栏刷新后 出现 拦截提示
      修改如下配置 前端路由两种模式---hash模式、history模式前端路由两种模式---hash模式、history模式|精讲-走看看......
  • 路飞 ---配置前端
    配置前端全局css1.整理项目将下面的所有文件都置为最纯净的样子APP.vue<template><divid="app"><router-view/></div></template>router/index.jsco......
  • 路飞-前端vue准备工作
    目录前端全局样式清除全局js变量配置axios全局使用/cookies全局使用安装elementui前端全局样式清除创建vue脚手架搭建项目,VUE2版本在src---assets文件夹下创建css文件夹......