前端如何获取图片

1. 使用js获取页面中所有的图片地址

var imgs = document.getElementsByTagName("img");var imgURLs=new Array(imgs.length);for(var i = 0;i<imgs.length;i++){ imgURLs[i] = imgs[i].src;//如果用document.getElementsByTagName("img")[i].src;每取一个图片地址就会对全部图片查找一次，这样效率比较低，还是储存在imgs中比较好！}//以上代码最好放在页面的最后面，或window.onload事件里，这样就不会因为页面没有全部加载完而没有全部读取到img元素使用js获取页面中所有的图片地址

2. js中怎么获取图片

直接系在innerHtml中只能显示为文本的

应该把img添加到DOM中去才可以显示

参考下面的代码

window.onload=function(){

varo=document.getElementById("C_Top");

varimg=document.createElement("img");

img.src="
https://www..com/img/bdlogo.png
";

varb=document.getElementById("bin2");

b.onclick=function(){

o.appendChild(img);

}

}

这样才能把img元素添加到document中

3. js怎么获取图片的相对地址

javascript中img.src属性可以获取到图片的完整路径， 相对路径要通过与相对位置计算得出。计算方法：
先要明确自己的相对位置在哪，这个是需要人为指定的。
核心代码如下：
var res=document.getElementById("img").src;
var root_href='根目录路径';
res=document.getElementById("img").src.replace(root_href,'');
用jquery方法
var res=$("#img").attr("src");
res=res.substring(res.indexOf("根")+2);
更多关于在上传文件的过程得到完整路径的方法请参考如下:
file.select();
var res=document.selection.createRange().text;
var res=file.files.item(0).getAsDataURL();
var res=file.value

4. js图片没有id，现在要获取这张图片到另外的页面，该怎么实现急用，在线等

用Jquery很快就可以做到了，获取图片最重要的是知道路径，知道路径后就直接能引用了，

而获取一个元素最好是有class或是id。从你的截图来看，img外层有一个a标签且这个标签有class='pic'。

但是这样好像还不够，因为可能拥有同样的类样式的a标签也有多个，同时我们还注意到有一个title的属性为餐椅，那么我们就可以这样写：

$('a.pic[title=餐椅]>img').attr('src');
//上面的选择器分析是这样的，选择一个class='pic'且title='餐椅的所有a标签下的所有img标签直接子元素，.attr()函数就是获取某一属性，这里我们明显要得到图片的src属性！

5. 如何通过js获取网页中所有图片并加入点击事件，实现

在网页加载完成时，通过js获取图片和添加点击的识别方式

- (void)webViewDidFinishLoad:(UIWebView *)webView {
[IDProgressHUD IDPlaceViewHideDirect:self.view];

//这里是js，主要目的实现对url的获取
static NSString * const jsGetImages =
@"function getImages(){\
var objs = document.getElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i<objs.length;i++){\
imgScr = imgScr + objs[i].src + '+';\
};\
return imgScr;\
};";

[webView :jsGetImages];//注入js方法
NSString *urlResurlt = [webView :@"getImages()"];
mUrlArray = [NSMutableArray arrayWithArray:[urlResurlt componentsSeparatedByString:@"+"]];
if (mUrlArray.count >= 2) {
[mUrlArray removeLastObject];
}
//urlResurlt 就是获取到得所有图片的url的拼接；mUrlArray就是所有Url的数组

//添加图片可点击js
[mWebView :@"function registerImageClickAction(){\
var imgs=document.getElementsByTagName('img');\
var length=imgs.length;\
for(var i=0;i<length;i++){\
img=imgs[i];\
img.onclick=function(){\
window.location.href='image-preview:'+this.src}\
}\
}"];
[mWebView :@"registerImageClickAction();"];
}
//在这个方法中捕获到图片的点击事件和被点击图片的url

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

//预览图片
if ([request.URL.scheme isEqualToString:@"image-preview"]) {
NSString* path = [request.URL.absoluteString substringFromIndex:[@"image-preview:" length]];
path = [path :NSUTF8StringEncoding];
//path 就是被点击图片的url
return NO;
}
return YES;
}

6. 如何在JS中获取图片的像素

方法一：获取图片的宽高。可以用offsetWidth和offsetHeight;

方法二：

1. 你先获取img标签标签元素。用getElementById()或者getElementsByClassName或者getElementsByTagName()都可以。

2. 获取之后，如果你的img图片有width和height 属性，可以直接用img元素对象点属性

document.getElementsByTagName("img")[0].width;

document.getElementsByTagName("img")[0].height;

3.如果img元素本身没有width和height属性。你可以获取img元素的style样式

functiongetStyle(obj,attr){

returnobj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr];

｝；

obj是你的img标签对象，attr是你的想要获取的属性；

currentStyle支持IE低版本浏览器，

getComputedStyle支持主流浏览器

7. 前台html页面的img标签图片想动态从数据库获取，如何获取

1、这个在数据库中存储img图片的地址，前台放置img服务器标签，后台读取数据库中的img图片地址赋值。

(7)前端如何获取图片扩展阅读

img 元素向网页中嵌入一幅图像。

请注意，从技术上讲，<img> 标签并不会在网页中插入图像，而是从网页上链接图像。<img> 标签创建的是被引用图像的占位空间。

<img> 标签有两个必需的属性：src 属性 和 alt 属性。

<img> 标签的 src 属性是必需的。它的值是图像文件的 URL，也就是引用该图像的文件的的绝对路径或相对路径。

为了整理文档的存储，创作者通常会把图像文件存放在一个单独的文件夹中，而且通常会将这些目录命名为 "pics" 或者 "images" 之类的名称。

在 W3School 在线教程中，我们的工程师把大部分常用的图像都存放到一个名为 "i" 的文件夹中，"i"是 "images" 的缩写，这样做的好处是可以最大程度地简化路径。

在 HTML 中，<img> 标签没有结束标签。在 XHTML 中，<img> 标签必须被正确地关闭。

在 HTML 4.01 中，不推荐使用 image 元素的 "align"、"border"、"hspace" 以及 "vspace" 属性。

在 XHTML 1.0 Strict DTD 中，不支持 image 元素的 "align"、"border"、"hspace" 以及 "vspace" 属性。

8. js 如何获取图片

获取img对象的属性，循环遍历imageOnName2数组对象，取需要的成员赋予src属性

9. 请问在js中用ajax能获取图片吗

通过ajax去请求图片路径，然后再加载到前端页面上是可以实现的

10. javascript中怎样读取指定文件夹里的图片

var i_strngth = 1;
var i_image = 0;
var imageurl = new Array();
// 这一部分我是手功指定的图片路径,你的图片路径是放在数据库中的，只用在这里做更改，把路径的设置改成动态读取就可以了
//======================================
imageurl[0] ="images/pic1.gif";
imageurl[1] ="images/pic2.gif";
imageurl[2] ="images/pic3.gif";
imageurl[3] ="images/pic4.gif";
//======================================
function showimage()
{
if(document.all)
{
if (i_strngth <= 110)
{
div_Pic.innerHTML = "<img style=\"filter:alpha(opacity='" + i_strngth + "'); height:248px; width:138px;\" src='" + imageurl[i_image] + "' border='0' />";
i_strngth = i_strngth + 10;
var timer=setTimeout("showimage()", 100);
}
else
{
clearTimeout(timer);
var timer = setTimeout("hideimage()", 1000);
}
}
if(document.layers)
{
clearTimeout(timer)
document.div_Pic.document.write("<img src='" + imageurl[i_image] + "' border='0' style='height:248px; width:138px;' />");
document.close();
i_image++;
if (i_image >= imageurl.length)
{
i_image = 0;
}
var timer = setTimeout("showimage()", 2000);
}
}
function hideimage()
{
if (i_strngth >= -10)
{
div_Pic.innerHTML = "<img style=\"filter:alpha(opacity='" + i_strngth + "'); height:248px; width:138px;\" src='" + imageurl[i_image] + "' border='0' />";
i_strngth = i_strngth - 10;
var timer = setTimeout("hideimage()", 100);
}
else
{
clearTimeout(timer)
i_image++;
if (i_image >= imageurl.length)
{
i_image = 0;
}
i_strngth = 1;
var timer=setTimeout("showimage()", 500);
}
}
那就需要用到Ajax技术，你是用时间来做为图片名称，那么可以用程序取出文件名然后选取离系统当前时间最近的一个文件做为当前显示的图片，然后回传达到JS来进行图片路径的更改显示