使用TS中元素使用offsetHeight，offsetTop，offsetLeft报错

最新推荐文章于 2023-04-24 16:40:00 发布
最新推荐文章于 2023-04-24 16:40:00 发布
阅读量2.9k 收藏 2
点赞数 2
文章标签： 1024程序员节
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_59916662/article/details/127486530
版权

使用ts后，可以使用scroll家族和client家族，但使用offset家族会报错但也能运行

报错

类型“Element”上不存在属性“offsetHeight”

 

 原因：ts中Element类型上没有定义offsetHeight，解决如下：通过as HTMLDivElement解决

(_content as HTMLDivElement).offsetHeight

要记得它只是只读的

 

相见一月
关注
前端技术搭建弹珠小游戏（内附源码）
官方推荐
05-08 7万+
上周我们实通过前端基础实现了小人逃脱，当然很多伙伴再评论区提出了想法，后续我们会考虑实现的，今天还是继续按照我们原定的节奏来带领大家完成一个弹珠游戏，功能也比较简单简单，也是想借助这样一个简单的功能，然后来帮助大家了解我们JavaScript在前端中的作用， 在前面的文章当中我们也提及到我们在本系列的专栏是循序渐进从简单到复杂的过程，后续会带领大家用前端实现翻卡片、扫雷、贪吃蛇等有趣的小游戏，纯前端语言实现，都会陆续带给大家。欢迎大家订阅我们这份前端小游戏的专栏。
vue3(setup语法糖+TS)
qq_52797518的博客
04-29 2675
Composition API 组件通信
前端自学浅入门笔记
司军礼的博客
01-03 168
前端浅入门 获取节点 childNodes 获取所有子节点 children 获取所有子元素 firstChild 获取第一个子节点 firstElementChild 获取第一个子元素 lastChild 获取最后一个子节点 lastElementChild ...
类型“Element”上不存在属性“offsetTop”
浮游的博客
07-11 4181
记录一次类型错误的解决方案，ts报错类型“Element”上不存在属性“offsetTop”。因为ts默认用的是Element，需要声明为HTMLElement 或是下面这样 当然如果你用的是angular的话，建议用 ElementRef
anguar6中 无法在Element上找到属性 (eg 原DOM的offsetTop)
weixin_30329623的博客
09-13 273
let aa=this.elementRef.nativeElement.querySelector('.logBox') ; 转载于:https://www.cnblogs.com/fuzitu/p/9639730.html
display:none 引起的cannot read property 'offsetLeft' of undefined
huangjinlong1024的博客
11-15 2427
昨天在写一个html页面时，js里面用了offsetLeft方法，运行时在控制台提示cannot read property ‘offsetLeft’ of undefined。排查之后发现是项目里面引用的一个通用css里面对body进行了一个设置 body{ display:none } 百度了一下offsetLeft,发现offsetLeft需要在bod...
margin&offsetLeft&left易错点
qq_30258495的博客
08-21 175
margin&offsetLeft&left易错点
ts Property ‘offsetTop‘ does not exist on type ‘Element‘
qubes的专栏
04-24 782
Element 类型上没有 offsetTop, HTMLElement 类型上有 offsetTop。可以在类型上点进去看到。
DOM元素尺寸和位置相关的属性(clientWidth、offsetWidth、scrollWidth...)总结
小赛赛爱吃肉
01-09 885
由于DOM元素位置和大小的属性这块和鼠标事件的知识点容易混淆，所以需要单独总结一下，又不想把截图存到本地，所以就有了这篇文章。如果有什么地方写的不对，还请私信或留言给我扶正! 谢谢。
在单vue3+ts页面里使用hammerjs实现对图片的放大缩小和移动,且移动不能超出屏幕范围
最新发布
07-08
3. 在Vue模板中使用ref指令引用图片元素： ```html ``` 这样，你就可以在Vue 3 + TypeScript页面中使用Hammer.js来实现对图片的放大缩小和移动，并且确保移动不超出屏幕范围。记得将"path/to/image.jpg...
【React+Ts】窗口拖拽+放大缩小功能
weixin_66127892的博客
03-27 924
tsx代码： import React, { Component, RefObject } from 'react' import './index.less' interface Iprop { } interface Istate { arr: arr[] } interface arr { id: symbol, txt: string } export default class index extends Component<Iprop, Istate>
JS兼容性问题---Element的offsetTop
baichong3681的博客
10-23 391
题目: 获取指定元素距离浏览器顶部的距离 方案: var distanceTop = element.offsetTop; 不兼容浏览器: IE 7及以下 原因: 未知, 貌似获得到的值是IE 8的offsetTop值 解决方案: position: relative; 测试后结果: 完美解决...
offsetHeight说明
学习笔记
03-15 5177
offsetHeight说明:<br />本站解释:<br />offsetHeight与offsetWidth 作用相同，前者是获取元素的高度后者则是宽度．offsetHeight属性可以获取元素的可见高度值．包括边框和内部空白补丁．但超出元素的内容则不被计算．也就是说只返回元素的实际高度值．如果看得着边框．从上边框到下边框的距离则是offsetHeight返回的值．经过我测试无论在IE或FF均返回正常．值得一提的是我利用css 来控制元素的高度，在IE里会被撑大,FF里则不会．但返回的值是正确的！off
Uncaught TypeError: Cannot read property 'offsetHeight' of null
热门推荐
hua_ban_yu的博客
09-21 2万+
在使用offsetHeight计算内容的高度时报Uncaught TypeError: Cannot read property 'offsetHeight' of null这个错误。 错误原因：JS运行的时候页面还没有加载完成，js代码找不到页面元素，就会抛出这个问题 解决方案：把自定义js放在&lt;body/&gt;结束标签前。 ...
TS 类型上不存在属性( Property ‘$xxx‘ does not exist on type ‘xxx‘；)
MISSNext的博客
07-05 1万+
问题 访问vue原型绑定的属性，在组件中使用的时候报错，如果使用eslint 运行不起来 解决 方式1（繁琐，使用页面需要增加多个） $http:any this.$http 方式2 (繁琐，使用此方法的组件都需要声明一次) [x:string]:any 方式三（建议使用这一种） 在src目录下新增xxx.d.ts文件 （全局声明简捷 如下） import VueRouter, { Route } from 'vue-router'; declare module 'vue/types/vue
html 滚动条 scrolltop scrollheight,HTML元素的height、offsetHeight、clientHeight、scrollTop等梳理...
weixin_39602280的博客
06-27 2543
关于元素的一些属性在前端的日常开发中，我们经常无可避免的需要获取或者监听一些页面的属性，那么我们需要经常了解一些属性代表的含义才能更好地使用这些属性。特别是一下这些：尺寸相关：offsetHeight、clientHeight、scrollHeight；偏移相关：offsetTop、clientTop、scrollTop、pageYOffset、scrollY；获取相对视口位置：Element.g...
【无标题】
yerong4410的博客
04-21 143
/ 当前节点的所有属性的list。// System.out.println("属性名称："+name+"属性值："+value);// System.out.println("当前节点的内容："+text);// System.out.println("当前节点名称："+name);
类型 never 上不存在属性
Ranye的博客
06-01 1万+
初始化的时候没报错不一定没有问题！
Element属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
socaicaicaicai的博客
12-09 1306
Element属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTopElement属性学习之clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTopclientHeight和offsetHeight属性和元素的滚动、位置没有关系它代表元素的高度。clientHeightoffsetHeightscrollHeightscrollTopoffsetTop Element属性学习之
JavaScript滚动属性详解：scrollTop、scrollHeight、offsetTop与offsetHeight
"这篇学习笔记主要探讨了JavaScript中与页面滚动相关的几个重要属性：scrollTop、scrollHeight、offsetTop和offsetHeight。这些属性在处理页面布局和动态效果时扮演着重要角色，尤其对于开发者来说，理解它们的工作...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值