当前位置: 首页 > news >正文

html5移动端适配;检测浏览器信息函数

html5移动端适配

//动态改变font-size大小
(function changeFontSize() {let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'if (!isPC()) {let docEl = document.documentElement;// recalc = function () {let clientWidth = docEl.clientWidth;docEl.style.fontSize = 100 * (clientWidth / 375)  + 'px';let scaledFontSize = parseInt(window.getComputedStyle(docEl, null).getPropertyValue('font-size'));let scaleFactor = 100 * (clientWidth / 375) / scaledFontSize;let originRootFontSize = parseInt(window.getComputedStyle(document.documentElement, null).getPropertyValue('font-size'));docEl.style.fontSize = originRootFontSize * scaleFactor * scaleFactor + 'px';// };} else {let docEl = document.documentElement;docEl.style.fontSize = 'unset'}// if (!doc.addEventListener) return;window.addEventListener(resizeEvt, changeFontSize, false);document.addEventListener('DOMContentLoaded', changeFontSize, false);
})(document, window);function isPC() {let userAgentInfo = navigator.userAgent;let Agents = ["Android", "iPhone","SymbianOS", "Windows Phone","iPad", "iPod"];let isPc = true;for (let i = 0;i< Agents.length; i++) {if (userAgentInfo.indexOf(Agents[i]) > 0) {isPc = false;break;}}if (document.documentElement.clientWidth <= 640) {isPc = false;}return isPc;
}

浏览器信息检测

//判断浏览器信息
function getNavigationInfo () {const ua = navigator.userAgentlet browserInfo = {trident: ua.indexOf('Trident') > -1, // IE浏览器 trident内核presto: ua.indexOf('Presto') > -1, // opera浏览器 presto内核webKit: ua.indexOf('AppleWebKit') > -1, // chrome safari浏览器 webkit内核gecko: ua.indexOf('Gecko') > -1 && ua.indexOf('KHTML') == -1, //firefox浏览器 gecko内核mobile: !!ua.match(/AppleWebKit.*Mobile.*/), // 是否为移动终端ios: !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), // ios终端android: ua.indexOf('Android') > -1 || ua.indexOf('Linux') > -1, // android终端或UC浏览器iPad: ua.indexOf('iPad') > -1, //iPad终端webApp: ua.indexOf('Safari') == -1, //是否web应用程序,没有头部与底部openOnVchat: ua.toLowerCase().match(/MicroMessenger/i) == "MicroMessenger".toLowerCase(), // 在微信中打开openOnWeiBo: ua.toLowerCase().match(/WeiBo/i) == "Weibo".toLowerCase(), // 在新浪微博客户端打开openOnQQ: ua.toLowerCase().match(/QQ/i) == "QQ".toLowerCase(),// 在QQ端打开}return browserInfo;
}

文本可编辑

在文本标签上加上属性contenteditable=“true”

深拷贝对象

function deepClone(obj) {if (obj === null || typeof obj !== 'object') {return obj;}let clone = Array.isArray(obj) ? [] : {};for (let key in obj) {if (obj.hasOwnProperty(key)) {clone[key] = deepClone(obj[key]);}}return clone;
}

相关文章:

html5移动端适配;检测浏览器信息函数

html5移动端适配 //动态改变font-size大小 (function changeFontSize() {let resizeEvt orientationchange in window ? orientationchange : resizeif (!isPC()) {let docEl document.documentElement;// recalc function () {let clientWidth docEl.clientWidth;docEl.…...

go依赖注入库samber/do使用

英语版本 介绍 以简单和高效而闻名的Go语言在其1.18版本中引入了泛型&#xff0c;这可以显着减少大量代码生成的需要&#xff0c;使该语言更加强大和灵活。如果您有兴趣&#xff0c; Go 泛型教程 是很好的学习资源。 通过使用 Go 的泛型&#xff0c;samber/do库为依赖注入 (…...

JMeter 配置元件之按条件读取CSV Data Set Config

实践环境 win10 JMeter 5.4.1 需求描述 需求是这样的&#xff0c;需要压测某个接口(取消分配接口)&#xff0c;请求这个接口之前&#xff0c;需要先登录系统(物流WMS系统)&#xff0c;并在登录后&#xff0c;选择并进入需要操作的仓库&#xff0c;然后请求接口&#xff0c;…...

MySQL跨服务器关联查询

1. 首先确认服务器的Federated引擎是否开启 show engines;修改数据库的配制文件my.ini,(我的my.ini的路径为&#xff1a;D:\ProgramData\MySQL\MySQL Server 5.7/my.ini),将federated添加到my.ini文件中 到MySQL的my.cnf配置文件中修改 在 [mysqld] 下方加入 federated 然后重…...

分库分表浅析

简介 对于任何系统而言&#xff0c;都会设计到数据库随着时间增长而累积越来越多的数据&#xff0c;系统也因为越来越多的需求变迁导致原有的设计不再满足现状&#xff0c;为了解决这些问题&#xff0c;分库分表就会走进视野&#xff0c;带着几个问题走入分库分表。 什么是分…...

java 宠物医院系统Myeclipse开发mysql数据库web结构jsp编程计算机网页项目

一、源码特点 java 宠物医院系统是一套完善的java web信息管理系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为Mysql5.0&…...

XMall 开源商城 SQL注入漏洞复现(CVE-2024-24112)

0x01 产品简介 XMall 开源电商商城 是开发者Exrick的一款基于SOA架构的分布式电商购物商城 前后端分离 前台商城:Vue全家桶 后台管理:Dubbo/SSM/Elasticsearch/Redis/MySQL/ActiveMQ/Shiro/Zookeeper等。 0x02 漏洞概述 XMall 开源商城 /item/list、/item/listSearch、/sys/…...

Docker原理及概念相关

Docker最核心的组件 image&#xff1a;镜像&#xff0c;构建容器&#xff0c;也可以通过Dockerfile文本描述镜像的内容。 (我们将应用程序运行所需的环境&#xff0c;打包为镜像文件) Container&#xff1a;容器 (你的应用程序&#xff0c;就跑在容器中 ) 镜像仓库(dockerhub)(…...

Vim相关配置

记录一下有关vim的一些设置&#xff0c;以免电脑寄了不好重新配置 vscodevim 首先是vscode中的vim模式 在应用商店中搜索vim插件安装即可 然后在setting中添加以下有关vim 的配置 "vim.easymotion": true,"vim.surround": true,"vim.incsearch"…...

ARMv8-AArch64 的异常处理模型详解之异常处理详解(进入异常以及异常路由)

在上篇文章 ARMv8-AArch64 的异常处理模型详解之异常处理概述Handling exceptions中&#xff0c;作者对异常处理整体流程以及相关概念做了梳理。接下来&#xff0c;本文将详细介绍处理器在获取异常、异常处理以及异常返回等过程中都做了哪些工作。 ARMv8-AArch64 的异常处理模型…...

unity学习(19)——客户端与服务器合力完成注册功能(1)入门准备

逆向服务器用了三天的时间&#xff0c;但此时觉得一切都值&#xff0c;又可以继续学习了。 服务器中登录请求和注册请求由command变量进行区分&#xff0c;上一层的type变量都是login。 public void process(Session session, SocketModel model) {switch (model.Command){ca…...

论文精读--对比学习论文综述

InstDisc 提出了个体判别任务&#xff0c;而且利用这个代理任务与NCE Loss去做对比学习从而得到了不错的无监督表征学习的结果&#xff1b;同时提出了别的数据结构——Memory Bank来存储大量负样本&#xff1b;解决如何对特征进行动量式的更新 翻译&#xff1a; 有监督学习的…...

文章复现 | 差异分析和PPI网络构建

原文链接&#xff1a;差异分析和PPI网路图绘制教程 写在前面 在原文中&#xff0c;作者获得285个DEG&#xff0c;在此推文中共获得601个DEG。小杜的猜想是标准化的水段不同的原因吧&#xff0c;或是其他的原因。此外&#xff0c;惊奇的发现发表医学类的文章在附件中都不提供相…...

入门级10寸加固行业平板—EM-I10J

亿道信息以其坚固耐用的智能终端设备而闻名&#xff0c;近日发布了一款理想入门级 10 英寸加固平板电脑—I10J。 EM-I10J​​ 这是一款 10 英寸的平板电脑&#xff0c;主要运行 Windows 10操作系统&#xff0c;带有硬化塑料外壳&#xff0c;具有 IP65 防水防尘功能和 MIL-STD 8…...

gem5 garnet 合成流量: packet注入流程

代码流程 下图就是全部. 剩下文字部分是细节补充,但是内容不变: bash调用python,用python配置好configuration, 一个cpu每个tick运行一次,requestport发出pkt. bash 启动 python文件并配置 ./build/NULL/gem5.debug configs/example/garnet_synth_traffic.py \--num-cpus…...

java实现排序算法(上)

排序算法 冒泡排序 时间和空间复杂度 要点 每轮冒泡不断地比较比较相邻的两个元素,如果它们是逆序的,则需要交换它们的位置下一轮冒泡,可以调整未排序的右边界,减少不必要比较 代码 public static int[] test(int[] array) {// 外层循环控制遍历次数for (int i 0; i <…...

「算法」滑动窗口

前言 算法需要多刷题积累经验&#xff0c;所以我行文重心在于分析解题思路&#xff0c;理论知识部分会相对简略一些 正文 滑动窗口属于双指针&#xff0c;这两个指针是同向前行&#xff0c;它们所夹的区间就称为“窗口” 啥时候用滑动窗口&#xff1f; 题目涉及到“子序列…...

Windows11(非WSL)安装Installing llama-cpp-python with GPU Support

直接安装&#xff0c;只支持CPU。想支持GPU&#xff0c;麻烦一些。 1. 安装CUDA Toolkit (NVIDIA CUDA Toolkit (available at https://developer.nvidia.com/cuda-downloads) 2. 安装如下物件&#xff1a; gitpythoncmakeVisual Studio Community (make sure you install t…...

rtt设备io框架面向对象学习-脉冲编码器设备

目录 1.脉冲编码器设备基类2.脉冲编码器设备基类的子类3.初始化/构造流程3.1设备驱动层3.2 设备驱动框架层3.3 设备io管理层 4.总结5.使用 1.脉冲编码器设备基类 此层处于设备驱动框架层。也是抽象类。 在/ components / drivers / include / drivers 下的pulse_encoder.h定义…...

华为OD机试真题- 攀登者2-2024年OD统一考试(C卷)

题目描述: 攀登者喜欢寻找各种地图,并且尝试攀登到最高的山峰。地图表示为一维数组,数组的索引代表水平位置,数组的高度代表相对海拔高度。其中数组元素0代表地面。例如[0,1,4,3,1,0,0,1,2,3,1,2,1,0], 代表如下图所示的地图,地图中有两个山脉位置分别为 1,2,3,4,5和8,9,1…...

龙虎榜——20250610

上证指数放量收阴线&#xff0c;个股多数下跌&#xff0c;盘中受消息影响大幅波动。 深证指数放量收阴线形成顶分型&#xff0c;指数短线有调整的需求&#xff0c;大概需要一两天。 2025年6月10日龙虎榜行业方向分析 1. 金融科技 代表标的&#xff1a;御银股份、雄帝科技 驱动…...

三维GIS开发cesium智慧地铁教程(5)Cesium相机控制

一、环境搭建 <script src"../cesium1.99/Build/Cesium/Cesium.js"></script> <link rel"stylesheet" href"../cesium1.99/Build/Cesium/Widgets/widgets.css"> 关键配置点&#xff1a; 路径验证&#xff1a;确保相对路径.…...

Python实现prophet 理论及参数优化

文章目录 Prophet理论及模型参数介绍Python代码完整实现prophet 添加外部数据进行模型优化 之前初步学习prophet的时候&#xff0c;写过一篇简单实现&#xff0c;后期随着对该模型的深入研究&#xff0c;本次记录涉及到prophet 的公式以及参数调优&#xff0c;从公式可以更直观…...

Qwen3-Embedding-0.6B深度解析:多语言语义检索的轻量级利器

第一章 引言&#xff1a;语义表示的新时代挑战与Qwen3的破局之路 1.1 文本嵌入的核心价值与技术演进 在人工智能领域&#xff0c;文本嵌入技术如同连接自然语言与机器理解的“神经突触”——它将人类语言转化为计算机可计算的语义向量&#xff0c;支撑着搜索引擎、推荐系统、…...

Java-41 深入浅出 Spring - 声明式事务的支持 事务配置 XML模式 XML+注解模式

点一下关注吧&#xff01;&#xff01;&#xff01;非常感谢&#xff01;&#xff01;持续更新&#xff01;&#xff01;&#xff01; &#x1f680; AI篇持续更新中&#xff01;&#xff08;长期更新&#xff09; 目前2025年06月05日更新到&#xff1a; AI炼丹日志-28 - Aud…...

掌握 HTTP 请求:理解 cURL GET 语法

cURL 是一个强大的命令行工具&#xff0c;用于发送 HTTP 请求和与 Web 服务器交互。在 Web 开发和测试中&#xff0c;cURL 经常用于发送 GET 请求来获取服务器资源。本文将详细介绍 cURL GET 请求的语法和使用方法。 一、cURL 基本概念 cURL 是 "Client URL" 的缩写…...

AD学习(3)

1 PCB封装元素组成及简单的PCB封装创建 封装的组成部分&#xff1a; &#xff08;1&#xff09;PCB焊盘&#xff1a;表层的铜 &#xff0c;top层的铜 &#xff08;2&#xff09;管脚序号&#xff1a;用来关联原理图中的管脚的序号&#xff0c;原理图的序号需要和PCB封装一一…...

接口 RESTful 中的超媒体:REST 架构的灵魂驱动

在 RESTful 架构中&#xff0c;** 超媒体&#xff08;Hypermedia&#xff09;** 是一个核心概念&#xff0c;它体现了 REST 的 “表述性状态转移&#xff08;Representational State Transfer&#xff09;” 的本质&#xff0c;也是区分 “真 RESTful API” 与 “伪 RESTful AP…...

自定义线程池1.2

自定义线程池 1.2 1. 简介 上次我们实现了 1.1 版本&#xff0c;将线程池中的线程数量交给使用者决定&#xff0c;并且将线程的创建延迟到任务提交的时候&#xff0c;在本文中我们将对这个版本进行如下的优化&#xff1a; 在新建线程时交给线程一个任务。让线程在某种情况下…...

运动控制--BLDC电机

一、电机的分类 按照供电电源 1.直流电机 1.1 有刷直流电机(BDC) 通过电刷与换向器实现电流方向切换&#xff0c;典型应用于电动工具、玩具等 1.2 无刷直流电机&#xff08;BLDC&#xff09; 电子换向替代机械电刷&#xff0c;具有高可靠性&#xff0c;常用于无人机、高端家电…...