如何获取在javascript菜单中动态生成的所有URL?

时间:2014-07-04 14:13:05

标签: javascript jquery image url download

我需要从this site的图库中下载所有图片,但我不知道如何获取它们的网址或存储这些网址的位置。

我试图用一些程序下载整个网站,但它们似乎都没有下载甚至菜单。 希望有人知道如何实现这一点,而无需一个接一个地手动完成。

在这里,我可以看到生成URL的代码:

<script type="text/javascript">
$(function(){
    $(".text-frame").not(".default-frame").hide();
    $('#menubar .button').hover(function(){
        $(this).toggleClass("button-hover");
    });
    $('#menubar .button').click(function(){
        $(".text-frame").hide();
        $("#image-viewer").hide();
        $(".button").removeClass("button-active");
        var showTextframe = $(this).attr("rel");
        $("#" + showTextframe).show();
        $(this).addClass("button-active");
    });

    function showImages (imgLinks){
        for (var i = 0; i < imgLinks.length; i++){
            //$("#image-box").append($('<img>').attr('src', imgLinks[i]));
            var $imgSelector = $('<a>'+ (i + 1) +'</a>')
                .data('imglink',imgLinks[i])
                .click(function(){
                    $("#image-box").find("img").attr('src', $(this).data('imglink'));
                    $("#image-links").find('a').removeClass('active');
                    $(this).addClass('active');
                    //alert ("I open Image" + $(this).data('imglink'));
                });
            $("#image-links").append($imgSelector);
            $("#image-links").find('a:first').trigger('click');
        }
    }

    $.get("plants_w_links.md", function(semillaMenu){
        var markdownConverter = new Showdown.converter();
        $semillaMenu = $(markdownConverter.makeHtml(semillaMenu));
        $semillaMenu.find("img").each(function(){
            var $menuimage = $(this);
            var $menulink = $(this).parent("li").find("a");
            var menuimages = $menulink.data("menuimages") || [];
            menuimages.push($menuimage.attr("src"));
            $menulink.data("menuimages",menuimages);
            $menuimage.remove();
        });

        $semillaMenu.find("a").click(function(){
            var menuImages = $(this).data("menuimages");
            //$("#image-box").empty();
            $("#image-links").empty();

            if (menuImages){
                $("#image-viewer").show();
                showImages(menuImages);

            }
        });

        $semillaMenu.addClass("sf-menu sf-vertical");
        $('#semilla-menu').html($semillaMenu);
        jQuery('ul.sf-menu').superfish({delay:10});

    });


});
</script>

函数showImages似乎生成了URL,但我不知道该如何处理。

我在这里发现很多问题,但是所有人都在谈论用渐进式网址下载图像(如blabla.com/image1.jpgblabla.com/image2.jpg等),但事实并非如此,图像生成没有模式(或者没有任何我可以获得或演绎的模式)。

编辑:我需要知道这些功能如何运作才能在Chrome检查控制台中运行类似的内容,它为我提供了所有网址,而不是菜单中点击选项的网址。

EDIT2: IRC频道中有人告诉我该脚本可能是jQuery,所以我正在添加标签。

2 个答案:

答案 0 :(得分:0)

var urls = new Array();      
Array.prototype.forEach.call( document.images, function( img ){ urls.push( img.src ) } );
console.log( urls );

执行后,这些代码行urls将包含页面上所有图像的来源。

答案 1 :(得分:0)

最后有人在jQuery聊天中告诉我如何解决我的问题。直接访问this link就是答案。该链接似乎包含semillaMenu函数格式(显着)的菜单结构以及在网站上显示图像的过程。

这还没有解决我的问题,因为它只适用于这种情况。我想要的是一种用脚本获取URL的方法,但它解决了我的问题。

所以,如果有人知道如何创建一个提供所有图片链接的脚本而不必手动处理plants_w_links.md文件,我就无法回答。