ios,safari10以下 报错attempted to assign to readonly property

2,488 阅读1分钟

如图所示错误:

代码如下

let childNode = document.createElement('span');
childNode.style = "width: 20px;height: 20px;border-radius: 10px;background: #FB7299;color: #FFFFFF;display: inline-block;position: absolute;font-size: 14px;font-family: PingFangSC-Regular;line-height:20px;";
childNode.style.top = e.offsetY - 10 + 'px';
childNode.style.left = e.offsetX - 10 + 'px';

对于以上代码,safari10会报错,出现attempted to assign to readonly property

这个报错是一个 ios中webkit内核的bug

解决方案:不去直接操作style,而是设置style属性

代码如下:

 childNode.setAttribute('style', `width: 20px;height: 20px;border-radius: 10px;background: #FB7299;color: #FFFFFF;display: inline-block;position: absolute;font-size: 14px;font-family: PingFangSC-Regular;line-height:20px;top:${e.offsetY - 10}px;left:${e.offsetX - 10}px`);