微信小程序通过createSelectorQuery获取元素 高度,宽度与界面距离
小程序官方有提供给我们一个 const query = wx.createSelectorQuery() 函数
我们可以先编写这样一段代码
wxml
<view><button bindtap="getDom">点击查看</button><view class = "textIn" style = "height: 100px;width: 30px;">测试工具</view><view class = "textIn" style = "height: 300px;width: 50px;">测试工具</view><view class = "textIn" style = "height: 500px;width: 20px;">测试工具</view>
</view>
这里 我们定义了 多块 view 都用 行内样式设置了它的 高度和宽度
js编写代码如下
Page({data: {},onLoad(options) {},getDom() {const query = wx.createSelectorQuery()query.selectAll('.textIn').boundingClientRect();query.exec(function (res) {console.log(res);})}})
我们运行代码 并点击按钮 点击查看
这里 我们获取了所有 类名中包含 textIn 的元素 并输出
这里 就正常的输出了 每个元素 高度 宽度 与页面上下左右的距离

相关文章:
微信小程序通过createSelectorQuery获取元素 高度,宽度与界面距离
小程序官方有提供给我们一个 const query wx.createSelectorQuery() 函数 我们可以先编写这样一段代码 wxml <view><button bindtap"getDom">点击查看</button><view class "textIn" style "height: 100px;width: 30px;&quo…...
MySQL-事务
MySQL-事务 1.什么是事务 举例:想象炒菜的过程。 洗菜切菜炒菜装盘 我相信缺少任何任何一个步骤,都不完美!!!可以将炒菜的过程理解为一个事务,是一组操作的集合,而MySQL中的事务也是如此。但…...
自动定时删除磁盘文件的脚本(从文件日期最早的开始删)
#!/bin/bash# 指定的挂载点 MOUNTPOINT"/media/vm/MyDisk512GB"# 设置磁盘大小的限制 (例如:800G) LIMIT$((800 * 1024 * 1024)) # 单位是KB# 获取挂载点的已使用空间 USED_SPACE$(df -kP "$MOUNTPOINT" | tail -1 | awk {print $3})echo &quo…...
拆解CPU的基本结构和运行原理
CPU的基本结构 CPU是一个计算系统的核心 南北桥芯片将CPU与外设连接起来 CPU执行流程 CPU的电路基础 组合电路基本原理 时序电路基本原理 多核成为主流 汇编语言和寄存器 中断的基本原理 中断的产生 中断服务程序 CPU 做为计算机的总司令官,它管理着计算…...
Docker安装——Ubuntu (Jammy 22.04)
一、为什么要用 Ubuntu?(centos和ubuntu有什么区别) 使用lsb_release命令:lsb_release -a ,即可查看ubantu的版本,但是为什么要使用ubantu 呢? 区别:1、centos基于EHEL开发,而ubunt…...
Fast DDS之Transport
目录 transport层负责为DDS用户数据收发和服务发现提供通信。包含UDP,TCP,SHM。...
爱普生L125X_L325X系列打印机Wi-Fi配置方法(Smart Panel)
准备工作: 手机需要下载“Epson Smart Panel”APP; 配置无线(Wi-Fi)方法 说明:SSID名称(Wi-Fi名)不能包含中文字符,路由器需要选择2.4GHz频段; 1. 打开“Epson Smart Panel”软件࿰…...
【回顾一下Docker的基本用法】
文章目录 回顾一下Docker的基本用法1.初识Docker1.1.什么是Docker1.1.1.应用部署的环境问题1.1.2.Docker解决依赖兼容问题1.1.3.Docker解决操作系统环境差异1.1.4.小结 1.2.Docker和虚拟机的区别1.3.Docker架构1.3.1.镜像和容器1.3.2.DockerHub1.3.3.Docker架构1.3.4.小结 1.4.…...
【Python】Python基础知识
【Python】Python基础知识 关键字 查看Python关键字: >python >>>import keyword >>>keyword.kwlist 注释 注释有两方面作用: (1)提高程序的可读性(最重要的作用);…...
【计算机视觉 05】YOLO论文讲解:V1-V7
https://ai.deepshare.net/live_pc/l_63243a65e4b050af23b79338 Part1.目标检测与YOLO系列 1. 目标检测任务及发展脉络 2. YOLO的发展史 Anchors Base原理: Part2.YOLOV1-V3 3. YOLO V1的网络结构 4. YOLO V3的网络结构与实验结果 Part3.YOLO的进化 5. YOLO V4的网络…...
git全局与单仓库的密码管理
概要 在使用git时,有默认的全局配置,每个仓库也有自己的配置,在使用时常常傻傻分不清楚,现在进行一个简单的整理记录。 一般情况下全局配置中的git账号和邮箱通常设置成自己的,其他仓库再根据项目需要进行单独配置&a…...
IDEA的使用(一) (IntelliJ IDEA 2022.1.3版本)
目录 1. IDEA项目结构 2. 模块的导入操作 2.1 正规操作 2.2 取巧操作 2.3 出现乱码 2.4 模块改名 3. 代码模板的使用 后缀补全(Postfix Completion)、实时模板(Live Templates)菜单里面什么介绍都有,可以自学&a…...
javaee SpringMVC文件上传 项目结构
引入依赖 <?xml version"1.0" encoding"UTF-8"?><project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schemaLocation"http://maven.apache.org/POM/4.0.0…...
JavaScript DOM 函数大全详解(使用最新的 JS 语法)
JavaScript DOM 函数大全详解(使用最新的 JS 语法) JavaScript 的 Document Object Model(DOM)是用于操作网页内容的编程接口。在最新的 JavaScript 语法下,我们有很多方便和高效的方法来处理 DOM。下面是一些常用 DO…...
Stm32_标准库_8_ADC_光敏传感器_测量具体光照强度
ADC简介 测量方式 采用二分法比较数据 IO通道 ADC基本结构及配置路线 获取数字变量需要用到用到光敏电阻的AO口,AO端口接在PA0引脚即可 测得的模拟数据与实际光照强度之间的关系为 光照强度 100 - 模拟量 / 40;代码: 完整朴素代码: #in…...
基于SSM的固定资产管理系统的设计与实现
末尾获取源码 开发语言:Java Java开发工具:JDK1.8 后端框架:SSM 前端:采用JSP技术开发 数据库:MySQL5.7和Navicat管理工具结合 服务器:Tomcat8.5 开发软件:IDEA / Eclipse 是否Maven项目&#x…...
Leetcode---364场周赛
题目列表 2864. 最大二进制奇数 2865. 美丽塔 I 2866. 美丽塔 II 2867. 统计树中的合法路径数目 一、最大二进制奇数 这题只要你对二进制有了解(学编程的不会不了解二进制吧),应该问题不大,这题要求最大奇数,1.奇数:只要保证…...
使用 Powershell 检索不理解的命令
使用 Powershell 检索不理解的命令 尝试使用 Powershell 完成 Powershell 的命令行 使用 Powershell 时,有时您会忘记某个 cmdlet 或想要了解哪些 cmdlet 可用。在这种情况下,最好在互联网上查找,但您也可以使用 Powershell 函数来完成。 以…...
基于 FPGA 的机器博弈五子棋游戏
基于 FPGA 的机器博弈五子棋游戏 一,设计目的 五子棋是一种深受大众喜爱的游戏,其规则简单,变化多端,非常富有趣味性 和消遣性。棋类游戏在具备娱乐性、益智性的同时也因为其载体大多是手机, 电脑等移动互联网设备导致现代社会低头族等现象更加严重,危害青少年的身 体健康…...
uCOSIII实时操作系统 三 移植
目录 uCOSIII简介: 准备工作: 准备基础工程: UCOSIII工程源码: UCOSIII移植: 向基础工程中添加相应的文件夹 向工程中添加分组 常见问题: 下载验证: uCOSIII简介: UCOS-I…...
LizzieYzy围棋AI分析平台:从棋谱复盘到AI教练的完整指南
LizzieYzy围棋AI分析平台:从棋谱复盘到AI教练的完整指南 【免费下载链接】lizzieyzy LizzieYzy - GUI for Game of Go 项目地址: https://gitcode.com/gh_mirrors/li/lizzieyzy 围棋作为世界上最复杂的棋类游戏之一,其学习曲线一直被认为是陡峭而…...
TV Bro电视浏览器革命性突破:让Android电视变身智能上网终端
TV Bro电视浏览器革命性突破:让Android电视变身智能上网终端 【免费下载链接】tv-bro Simple web browser for android optimized to use with TV remote 项目地址: https://gitcode.com/gh_mirrors/tv/tv-bro 您是否曾在大屏幕电视前感到手足无措࿱…...
n8n工作流模板大全:从入门到精通的自动化实战指南
1. 项目概述:一个为n8n用户准备的“万能工具箱” 如果你正在使用或者听说过n8n这个强大的工作流自动化工具,那你一定遇到过这样的时刻:面对一个空白的画布,知道n8n能帮你连接一切,但就是不知道从何下手,或…...
Vue3-DateTime-Picker:现代化Vue 3日期时间选择器的完整指南
Vue3-DateTime-Picker:现代化Vue 3日期时间选择器的完整指南 【免费下载链接】vue3-date-time-picker Datepicker component for Vue 3 项目地址: https://gitcode.com/gh_mirrors/vu/vue3-date-time-picker 在当今的Web开发中,日期时间选择器是几…...
ChatGPT Web:5分钟快速搭建你的专属AI聊天室
ChatGPT Web:5分钟快速搭建你的专属AI聊天室 【免费下载链接】chatgpt-web A third-party ChatGPT Web UI page built with Express and Vue3, through the official OpenAI completion API. / 用 Express 和 Vue3 搭建的第三方 ChatGPT 前端页面, 基于 OpenAI 官方…...
ACID [Atomicity, Consistency, Isolation, Durability]
ACID [Atomicity, Consistency, Isolation, Durability] 原子性、一致性、隔离性、持久性package further.zwf.acid;import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.SQLException;/*** MySQL 事务示例&am…...
嵌入式Python库CI/CD实战:Travis CI自动化测试与发布
1. 项目概述与核心价值 如果你正在维护一个开源项目,或者在一个小团队里负责核心模块的开发,那么你一定对“这次改动会不会把别人的代码搞坏”这个问题感到头疼。尤其是在嵌入式开发领域,比如我们常用的CircuitPython库,代码最终要…...
基于Cursor的AI编程助手:从提示词工程到个性化工作流配置
1. 项目概述:一个基于Cursor的AI编程助手最近在GitHub上看到一个挺有意思的项目,叫mk-knight23/AI-ASSISTANT-CURSOR。乍一看名字,你可能以为又是一个普通的AI代码生成工具,但仔细研究下来,发现它的定位和实现思路有点…...
2025届必备的五大降AI率工具推荐榜单
Ai论文网站排名(开题报告、文献综述、降aigc率、降重综合对比) TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 伴随人工智能内容生成被广泛运用,其潜在风险愈发明显地呈现出来。为了应对这些具…...
保姆级图解:NCCL的bootstrap网络连接到底是怎么“手拉手”建起来的?
保姆级图解:NCCL的bootstrap网络连接到底是怎么"手拉手"建起来的? 想象一群小朋友要围成一个圆圈玩游戏,但彼此都不认识。NCCL的bootstrap网络建立过程,就像这个"手拉手成圈"的奇妙旅程。本文将用最直观的类…...
