我已经对代码进行了以下修改来解决这些问题:
CSS 样式改进:
移除了可能导致下划线变长的 transition 效果
使用 ::after 伪元素来创建下划线,而不是使用 border-bottom
添加了 !important 标记来确保样式不被其他网站的 CSS 覆盖
设置了固定的下划线宽度 width: 100% !important
移除了所有可能的动画效果
2. 事件处理改进:
使用事件捕获模式(添加了 true 参数)来确保事件能被正确捕获和处理
添加了触摸事件支持(touchstart 和 touchend)
移除了 nodePool 的使用,直接创建新的 DOM 元素
添加了更明确的定位和显示样式
结构改进:
为包装元素添加了明确的内联显示样式
确保所有关键样式都使用 !important 来防止被覆盖
移除了可能导致布局问题的过渡效果
这些修改应该能解决:
下划线逐渐变长的问题
2. 触摸无法触发翻译的问题
样式被其他网站 CSS 覆盖的问题