在新换的 spfk 主题里的 main.js 中有这样一段代码 
{% fold 点击显/隐代码%}```javascript main.js 
//是否使用fancybox 
if(yiliaConfig.fancybox === true){ 
require([yiliaConfig.rootUrl + 'fancybox/jquery.fancybox.js'], function(pc){ 
var isFancy = $(&quot;.isFancy&quot;); 
if(isFancy.length != 0){ 
var imgArr = $(&quot;.article-inner img&quot;); 
for(var i=0,len=imgArr.length;i&lt;len;i++){ 
var src = imgArr.eq(i).attr(&quot;src&quot;); 
var title = imgArr.eq(i).attr(&quot;alt&quot;); 
imgArr.eq(i).replaceWith(&quot;<a href='"+src+"' title='"+title+"' rel='fancy-group' class='fancy-ctn fancybox'><img src='"+src+"' title='"+title+"'></a>&quot;); 
} 
$(&quot;.article-inner .fancy-ctn&quot;).fancybox(); 
} 
}); 
}
<pre style="background-color:#fff">{% endfold %}

很容易明白,这是处理fancybox中,点击放大图片功能的代码 
检测到图片后会自动修改 `img` 为 `&lt;a ...&gt;&lt;img ...&gt;&lt;/a&gt;` 
&lt;!--more--&gt;

而 spfk 对 a 有单独的 css 样式 
因此当插入图片时,就会套用 a 的样式（有背景色） 

显然,只需要将fancybox对应的a元素修改回默认值即可 
{% fold 点击显/隐代码%}```css
a.fancy-ctn.fancybox {
 background-color: transparent ;
 border: 0;
}
</pre>{% endfold %}
然后,对于上面转换的js,可以发现有比较大的bug 
假如我给img指定了<code>width</code>和<code>height</code> 
那么,这个转换程序并不会自动转换
因此需要增加对 <code>id</code> <code>class</code> <code>width</code> <code>height</code> 的识别 
而假如img不存在某个元素,相应的变量为 <code>undefined</code> 
可以使用下面的方法判断一个变量是否为 <code>undefined</code> 
<code>typeof(a)==&quot;unfined&quot;</code>
修改后代码如下 
{% fold 点击显/隐代码%}```javascript 
//是否使用fancybox 
if(yiliaConfig.fancybox === true){ 
require([yiliaConfig.rootUrl + 'fancybox/jquery.fancybox.js'], function(pc){ 
var isFancy = $(&quot;.isFancy&quot;); 
if(isFancy.length != 0){ 
var imgArr = $(&quot;.article-inner img&quot;); 
for(var i=0,len=imgArr.length;i&lt;len;i++){ 
var flag = imgArr.eq(i).attr(&quot;no-fancybox&quot;); 
if(flag==&quot;true&quot;) 
continue;
<pre><code> var src = imgArr.eq(i).attr(&quot;src&quot;);
 var title = imgArr.eq(i).attr(&quot;alt&quot;);
 var width = imgArr.eq(i).attr(&quot;width&quot;);
 var height = imgArr.eq(i).attr(&quot;height&quot;);
 var id = imgArr.eq(i).attr(&quot;id&quot;);
 var clas = imgArr.eq(i).attr(&quot;class&quot;);

 var temp = &quot;&lt;a&quot;;
 if(typeof(src)!=&quot;undefined&quot;)
 temp+=&quot; href='&quot;+src+&quot;'&quot;;
 if(typeof(title)!=&quot;undefined&quot;)
 temp+=&quot; title='&quot;+title+&quot;'&quot;;
 temp+=&quot; rel='fancy-group' class='fancy-ctn fancybox'&gt;&lt;img&quot;
 if(typeof(id)!=&quot;undefined&quot;)
 temp+=&quot; id='&quot;+id+&quot;'&quot;;
 if(typeof(clas)!=&quot;undefined&quot;)
 temp+=&quot; class='&quot;+clas+&quot;'&quot;;
 if(typeof(src)!=&quot;undefined&quot;)
 temp+=&quot; src='&quot;+src+&quot;'&quot;;
 if(typeof(alt)!=&quot;undefined&quot;)
 temp+=&quot; alt='&quot;+title+&quot;' title='&quot;+title+&quot;'&quot;;
 if(typeof(width)!=&quot;undefined&quot;)
 temp+=&quot; width='&quot;+width+&quot;'&quot;;
 if(typeof(height)!=&quot;undefined&quot;)
 temp+=&quot; height='&quot;+height+&quot;'&quot;;
 temp+=&quot; /&gt;&lt;/a&gt;&quot;

 imgArr.eq(i).replaceWith(temp);
 
 }
 $(&quot;.article-inner .fancy-ctn&quot;).fancybox();
 }
});
</code></pre>
}
<pre style="background-color:#fff">{% endfold %}</pre>

主题bug修复及Javascript中判定undefined