如何從Flex中的HTML控件獲取所有圖像？

Question

我在Flex中有一個成功加載頁面的HTML控件。 有沒有辦法可以從HTML控件中提取或獲取所有圖像並顯示它們？

Answer 1

您實際上可以使用HTML文檔DOM並詢問所有img標籤。這種方式更清潔。

一旦你得到了DOM，這是所有的標準，所以你可以檢查HTML DOM documentation如果你不確定的東西。

下面是快速示例。我只是寫onComplete函數，因爲它會在Taurayi的例子中調用

var _imagesSrc:Array= []; 
private function onComplete(e:Event):void 
{ 
    var htmlLoader:HTMLLoader = e.target as HTMLLoader; 
    var doc:* = htmlLoader.window.document; //use void (*) type for DOM objects 
    var imgTags:* = doc.getElementsByTagName("img"); 
    if(imgTags) 
    { 
     for(var i:int=0;i<imgTags.length;i++) 
     { 
      var src:* = imgTags[i].getAttribute("src"); //not sure about return type here, could also be a String 
      if(src) 
       _imagesSrc.push(src.toString()); 
     } 
    } 
} 

Answer 2

那麼一個想法是，你加載的HTML頁面使用HTMLLoader，然後當它已經加載你得到的來源。然後使用解析器或正則表達式，可以提取<img />標記的src屬性的值。 src屬性的值將成爲您加載頁面上圖像的URL。然後使用Loader和上述網址，您可以將它們加載到您的Flash應用程序中。

下面是一個例子：

Main.as（文檔類）：

package 
{ 
    import flash.display.Loader; 
    import flash.display.LoaderInfo; 
    import flash.display.Sprite; 
    import flash.events.Event; 
    import flash.html.HTMLLoader; 
    import flash.net.URLRequest; 

    public class Main extends Sprite 
    { 
     public function Main():void 
     { 
      var htmlLoader:HTMLLoader = new HTMLLoader(); 
      htmlLoader.addEventListener(Event.COMPLETE, onComplete); 
      htmlLoader.width = stage.stageWidth; 
      htmlLoader.height = stage.stageHeight; 
      htmlLoader.load(new URLRequest("http://www.wampserver.com/")); 

     }// end function 

     private function onComplete(e:Event):void 
     { 
      var htmlLoader:HTMLLoader = e.target as HTMLLoader; 
      var body:String = htmlLoader.window.document.body.outerHTML; 
      var imgTags:Array = getImgTags(body); 
      var src:String = getSrc(imgTags[1]); 

      trace(src); // output: http://www.wampserver.com/wp-content/themes/wampserver/img/home-title.png 


      var loader:Loader = new Loader(); 
      loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaderComplete); 
      loader.load(new URLRequest(src)); 

     }// end function 

     private function onLoaderComplete(e:Event):void 
     { 
      var loader:Loader = (e.target as LoaderInfo).loader; 
      addChild(loader); 

     }// end function 

     private function getImgTags(source:String):Array 
     { 
      return source.match(/(<img.*?>)/g); 

     }// end function 

     private function getSrc(imgTag:String):String 
     { 
      return imgTag.match(/src="(.*?)"/)[1]; 

     }// end function 

    }// end class 


}// end package 

請記住，這只是一個想法，也有一些明顯的缺陷。