如何改写.removeAttribute兼容jQuery 3.3.1？修复fancybox脚本兼容问题

1. 如何改写.removeAttribute方法，使其兼容jQuery 3.3.1？ #

先帮你理清报错根源：在jQuery 3.x版本里，如果你直接通过$(element).style调用方法，拿到的是jQuery封装后的对象，不是原生DOM元素的style对象，而removeAttribute是原生DOM元素style对象独有的方法，自然会报“removeAttribute不是函数”的错。

给你两个实用的解决思路：

• 方案一：获取原生DOM元素后调用方法
  先通过get(0)或者[0]拿到jQuery对象对应的原生DOM元素，再调用style的removeAttribute，比如：

  // 移除元素内联style中的filter属性
  $('#your-element').get(0).style.removeAttribute('filter');
  

  为了避免元素不存在时报错，可以加个简单判断：

  const elem = $('#your-element').get(0);
  if (elem) {
    elem.style.removeAttribute('filter');
  }
  

• 方案二：用jQuery原生方法替代
  要是你的需求是移除内联style里的某个CSS属性，用jQuery的css()方法更稳妥——当你把属性值设为空字符串时，jQuery会自动移除对应的内联样式声明，效果和style.removeAttribute()完全一致，还不用操心原生元素的兼容问题：

  $('#your-element').css('filter', '');
  

2. 重写fancybox中报错的语句 #

原代码报错的核心和上面一样，我们可以直接换掉removeAttribute，用更兼容的方式实现相同效果：

重写方式一：原生JS兼容写法 #

给元素存在性加判断，直接把filter样式设为空字符串，和移除属性的效果完全一致：

a.support.opacity || (p.get(0) && (p.get(0).style.filter = ''), f.get(0) && (f.get(0).style.filter = ''));

重写方式二：jQuery极简写法 #

用jQuery的css()方法替代，代码更简洁，还能自动处理元素不存在的情况，完美适配jQuery 3.3.1：

a.support.opacity || (p.css('filter', ''), f.css('filter', ''));

内容的提问来源于stack exchange，提问作者Matthew S