baguetteBox.js兼容无a标签外围的img图片

baguetteBox.js是一个比较好用的灯箱（悬浮窗图片）插件，项目地址在

https://github.com/feimosi/baguetteBox.js/blob/dev/src/baguetteBox.js

它所匹配的格式为

<div class="images">
    <a href="IMAGE_URL">
        <img src="IMAGE_URL" />
    </a>
</div>

使用一行代码即可启用灯箱

baguetteBox.run('.images')

但是目前数据库所存放的内容的格式为

<div class="images">
    <img src="IMAGE_URL" />
</div>

没有a标签外围，这就需要对baguetteBox.js的源码做一些修改：

1，匹配a标签改为匹配img标签：

找到代码片段：

if (galleryElement.tagName === 'A') {
                tagsNodeList = [galleryElement];
            } else {
                tagsNodeList = galleryElement.getElementsByTagName('a');
            }

a改为img：

if (galleryElement.tagName === 'A') {
                tagsNodeList = [galleryElement];
            } else {
                tagsNodeList = galleryElement.getElementsByTagName('img');
            }

2，匹配href属性改为匹配src属性：

找到代码片段，getImageSrc函数：

function getImageSrc(image) {
        // Set default image path from href
        var result = image.href;

把href改为src：

function getImageSrc(image) {
        // Set default image path from src
        var result = image.src;

3，因为直接匹配了img标签，源程序按“a标签中匹配img标签”写的，把这部分处理掉：

找到代码片段：

// Get element reference, optional caption and source path
        var imageElement = galleryItem.imageElement;
        var thumbnailElement = imageElement.getElementsByTagName('img')[0];
        var imageCaption = typeof options.captions === 'function' ?

把('img')[0]注释掉：

// Get element reference, optional caption and source path
        var imageElement = galleryItem.imageElement;
        var thumbnailElement = imageElement.getElementsByTagName/*('img')[0]*/;
        var imageCaption = typeof options.captions === 'function' ?

然后试一下，此时baguetteBox.js已经兼容不带外围a标签的img图片了。