js如何獲取網(wǎng)頁(yè)所有圖片
更新時(shí)間：2017年05月12日 11:13:08 作者：exponent
這篇文章主要為大家詳細(xì)介紹了js如何獲取網(wǎng)頁(yè)所有圖片，js獲取網(wǎng)頁(yè)所有圖片的方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
需求
在網(wǎng)頁(yè)中單擊某張圖片，圖片能放大顯示，且能按順序切換圖片，同時(shí)，一些小圖標(biāo)和不符合要求的圖片不能放大。
由于網(wǎng)頁(yè)是在app中打開(kāi)，圖片的放大與切換由移動(dòng)端實(shí)現(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)簽的屬性進(jìn)行存儲(chǔ)
$(imgs[i]).attr('index',i);
$(imgs[i]).click(function () {
//獲取上面存儲(chǔ)的圖片的索引，這個(gè)索引就是當(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);
}
});
}
}
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了個(gè)人小程序接入支付解決方案，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
c#程序員對(duì)TypeScript的認(rèn)識(shí)過(guò)程
本文向大家詳細(xì)展示了從C#程序員的視角學(xué)習(xí)TypeScript的過(guò)程，主要是針對(duì)這兩種語(yǔ)言的異同進(jìn)行了簡(jiǎn)單的對(duì)比學(xué)習(xí)，希望對(duì)大家能夠有所幫助。2015-06-06
js實(shí)現(xiàn)拖動(dòng)模態(tài)框效果
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)拖動(dòng)模態(tài)框效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
Google 二維條碼 API 整理，需要的朋友可以參考下。2010-11-11
微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動(dòng)畫
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)圓形進(jìn)度條動(dòng)畫，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-06-06
把Xml字段先讀出來(lái)，然后用Js去操作，這樣豈不是簡(jiǎn)單了許多，于是網(wǎng)上搜索了一些JS讀Xml字段信息的方法2014-10-10
詳解用場(chǎng)景去理解函數(shù)柯里化(入門篇)
這篇文章主要介紹了用場(chǎng)景去理解函數(shù)柯里化(入門篇)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
總結(jié)分享10個(gè)JavaScript代碼優(yōu)化小tips
這篇文章主要介紹了總結(jié)分享10個(gè)JavaScript代碼優(yōu)化小tips，文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-07-07
js中Object.defineProperty()方法的不詳解
這篇文章主要介紹了js中Object.defineProperty()方法的不詳解，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-07-07
這篇文章主要為大家詳細(xì)介紹了微信小程序如何獲取用戶信息，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-01-01