我正在尋找在HTML字符串中創建所有圖像的數組。什麼是創建一個字符串中找到的所有圖像數組的最佳方式?
我試過使用以下內容,但如果完整的URL路徑不存在於src中,它會生成錯誤。
var found = $(html).find('img');
我正在尋找在HTML字符串中創建所有圖像的數組。什麼是創建一個字符串中找到的所有圖像數組的最佳方式?
我試過使用以下內容,但如果完整的URL路徑不存在於src中,它會生成錯誤。
var found = $(html).find('img');
$("img").each(
function(index) {
theArray.push($(this).attr("src"));
});
如何將變量'html'傳遞給那個? 'html'是我需要搜索的字符串。 – TheRealJAG 2012-04-16 03:08:14
@ JorgeA.Gonzalez,你在搜索一個字符串還是在搜索一個網頁(即DOM)? – Marc 2012-04-16 03:10:24
這是我從回調函數中獲取的一串HTML。 – TheRealJAG 2012-04-16 03:12:17
就試試這個:
var imgArray = $('img'),
srcArray = [];
console.log(imgArray); // array of imgs
$.each(imgArray, function() {
srcArray.push(this.src));
});
'this.src'比'$(this).attr('src')更快速,類型更少'' – RobG 2012-04-16 04:55:21
@RobG感謝您的評論.. :) – thecodeparadox 2012-04-16 04:57:57
快速運行的如何實現這個了下來:
打開與jQuery的DOM就緒功能 - >
$(function(){
創建變量found
包含元素的集合。
var found = $('p > img');
創建一個空數組來保存我們的結果。
var results = new Array();
迭代通過各元素的,我們found
$.each(found, function(index,value){
對於每個「值」,我們發現,我們要採取的SRC和推送SRC到陣列(項目) 。
results.push($(value).attr('src'));
錯誤的閉合
});
警報數組中的項的總量;
alert('There is a total of '+results.length+' results in the Array.');
只提示我們添加到數組中的第三項的src。
alert('The src of the 3rd item is: '+results[2]); //3nd item in array, indexes are 0 based
錯誤的關閉
});
希望這有助於明確了一點東西。
你可以做到這一點通過創建一個 「即時」 HTML元素的簡單和普通的JavaScript:
例如:
var html = "<html><body><img src='/img1.png' /><br /><img src='/img2.png' /></body></html>";
var node = document.createElement("div");
node.innerHTML = html;
for(var i=0; i < node.children.length; i += 1) {
if (node.children[i].tagName === 'IMG') {
alert(node.children[i].src)
};
}
我得到'無法加載資源/ on/img1巴紐。爲什麼我在搜索功能中遇到這些錯誤?他們是否被JS驗證? – TheRealJAG 2012-04-16 03:32:33
這是我從輸出數組中獲得的結果「chrome-extension://gabjcfmfiiglnojdinndihaijejbefem/img1.png」 – TheRealJAG 2012-04-16 03:34:20
它預先顯示當前的域,所以如果你在chrome擴展頁面上,那麼這是正確的。如果你不需要它,那麼拆分'/'並從數組中取出最後一個元素來獲取文件名。 – Sam 2012-04-16 04:01:12
so這個字符串是什麼樣的?和哪些錯誤? – Joseph 2012-04-16 02:55:14
該字符串是一個標準的HTML頁面。我得到的錯誤是「無法加載資源」當源代碼中沒有包含完整路徑時,我似乎得到了這些錯誤。 IE中的CSS樣式表... – TheRealJAG 2012-04-16 03:07:12
你以後用'found'做了什麼? – 2012-04-16 03:25:26