js如何獲取網(wǎng)頁所有圖片
更新時間：2017年05月12日 11:13:08 作者：exponent
這篇文章主要為大家詳細介紹了js如何獲取網(wǎng)頁所有圖片，js獲取網(wǎng)頁所有圖片的方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
需求
在網(wǎng)頁中單擊某張圖片，圖片能放大顯示，且能按順序切換圖片，同時，一些小圖標(biāo)和不符合要求的圖片不能放大。
由于網(wǎng)頁是在app中打開，圖片的放大與切換由移動端實現(xiàn)，因此，需要用js調(diào)用原生方法，并傳遞所有圖片的url
解決
var img = [];
for(var i=0;i<$("img").length;i++){
//獲取所有符合放大要求的圖片，將圖片路徑(src)獲取
if(parseInt($("img").eq(i).css("width"))>20){
img[i] = $("img").eq(i).attr("src");
}
}
var img_info = {};
img_info.list = img; //保存所有圖片的url
var imgs = document.getElementsByTagName('img');
for(var i = 0;i < imgs.length; i++){
if(parseInt($(imgs[i]).css('width')) > 20){
//將索引當(dāng)作img標(biāo)簽的屬性進行存儲
$(imgs[i]).attr('index',i);
$(imgs[i]).click(function () {
//獲取上面存儲的圖片的索引，這個索引就是當(dāng)前圖片的索引
img_info.index = $(this).attr('index');
//將信息轉(zhuǎn)為json字符串
var json = JSON.stringify(img_info);
//判斷是ios端還是android端
if (_IsIOS()) {
window.webkit.messageHandlers.showImg.postMessage(json);
} else if (_IsAndroid()) {
window.control.call('showImg',json);
}
});
}
}
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了個人小程序接入支付解決方案，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
本文向大家詳細展示了從C#程序員的視角學(xué)習(xí)TypeScript的過程，主要是針對這兩種語言的異同進行了簡單的對比學(xué)習(xí)，希望對大家能夠有所幫助。2015-06-06
這篇文章主要為大家詳細介紹了js實現(xiàn)拖動模態(tài)框效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-07-07
Google 二維條碼 API 整理，需要的朋友可以參考下。2010-11-11
這篇文章主要為大家詳細介紹了微信小程序?qū)崿F(xiàn)圓形進度條動畫，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-06-06
把Xml字段先讀出來，然后用Js去操作，這樣豈不是簡單了許多，于是網(wǎng)上搜索了一些JS讀Xml字段信息的方法2014-10-10
這篇文章主要介紹了用場景去理解函數(shù)柯里化(入門篇)，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
總結(jié)分享10個JavaScript代碼優(yōu)化小tips
這篇文章主要介紹了總結(jié)分享10個JavaScript代碼優(yōu)化小tips，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下2022-07-07
js中Object.defineProperty()方法的不詳解
這篇文章主要介紹了js中Object.defineProperty()方法的不詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
這篇文章主要為大家詳細介紹了微信小程序如何獲取用戶信息，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-01-01