当前位置: 首页 > Web前端 > HTML5

ios10以下safari设置样式无效

时间:2023-04-04 22:41:28 HTML5

项目中遇到的奇怪问题已经定位。Attemptedtoassigntoreadonlyproperty错误原因:项目中写了一个点击事件来添加动态效果,类似转身,旋转(360)。一个非常简单的特效。将元素的transition:transform设置为1s。然后动态改变元素的transform:rotate的角度。一切看起来都很好。本地测试和真机测试都OK。但是经过测试,被测IOS10下的safari并没有生效。定位原因:一开始以为transform没有前缀。但确认后排除。于是真机连接代理测试,点击事件弹出alert,但是没有执行。所以确认有错误。trycatch后弹出错误。Attemptedtoassigntoreadonlyproperty根据数据,这是一个safari内核错误。网上有解决办法,不要用strict模式,即去掉'usestrict'。(没有验证,因为感觉不可行,也是小亏)解决方案。猜测是不能直接改变Style,但是Style.transform应该可以设置。测试是可行的,但是这样设置多个属性的时候不够优雅,可以换成一个类。但是因为旋转角度涉及到计算,所以我没有采用设置类的方案。不正确:dom.style=`transform:rotate(${x}deg)`;正确的dom.style.transfrom='rotate(${x}deg)';