`

将文件夹内图片扫描成网页代码(Javascript)

    博客分类:
  • web
 
阅读更多

功能:将“扫描图片成网页.html”拷贝到图片所在目录,打开,点击按钮即可生成包括该目录下所有图片的网页。

觉得对您有用可以下载附件,有使用方法。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script type="text/javascript">
function getCurrentDirectory(){
	var locHref = location.href;
	var locArray = locHref.split("/");
	var str = "";
	/**这里测试locArray效果**
    for(x in locArray){
      document.write("locArray[");
      document.write(x+"]: ");
      document.write(locArray[x]+"<br />");
    }
    **/
    delete locArray[locArray.length-1];
    var dirtxt = locArray.join("/");
	str = dirtxt.substr(8);
	//document.write ("<div align=center>" + str + "</div><br />\n\n\n");
	document.form1.localfolder.value = str;
    return str;
} 

function searchFiles(dir, flag_all, flag_name){
	if (dir == "")
	{
		if (document.form1.localfolder.value == "")
			var dir = String(getCurrentDirectory());
		else
			var dir = document.form1.localfolder.value;
	}
	if (dir.substr(dir.length-1, 1) != "\\" && dir.substr(dir.length-1, 1) != "/")
		dir = dir + "\\";
	dir = dir.replace(/\//g, "\\");
    var fso = new ActiveXObject("Scripting.FileSystemObject");
    var f = fso.GetFolder(dir);
    var fc = new Enumerator(f.files);
    var str = "";
	var content = "";
	
	for (; !fc.atEnd(); fc.moveNext())
	{
		str = fc.item();
		type = fso.GetExtensionName(str).toLowerCase();
		if (type == "jpg" || type == "gif" || type == "png")
		{
			temp = str.Name.toLowerCase();
			//不带名字 
			if (flag_name == 0)
				content = "<p align=center><img src=\"" + dir + temp + "\" /></p><br />\n";
			//带名字
			else
				content = "<p align=center><img src=\"" + dir + temp + "\" /><br /> " + temp.substring(temp.indexOf("-")+1, temp.lastIndexOf(".")) + "</p><br />\n";
			document.write (content);
		}
	}
	
	if (flag_all == 1)  //读取目录下所有目录下的图片
	{
        var fk = new Enumerator(f.SubFolders);
        for (; !fk.atEnd(); fk.moveNext())
        {
			str = String(fk.item());
            //document.write( str.substr(dir.length) + "<br>");
			var dir_name = dir + str.substr(dir.length) + "\\";
			dir_name = dir_name.replace("/", "\\");
			document.write("<hr /><br />\n<p align=center>子文件夹:" + dir_name + "</p>\n")
			searchFiles(dir_name, flag_all, flag_name);
        }
	}

}
</script>



<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>扫描图片生成网页</title>
<style type="text/css">
<!--
body,td,th {
	font-size: 14px;
}
-->
</style></head>
<body bgcolor="#FFFFFF" onLoad="getCurrentDirectory()">
<p align="center"><font style="font-family:'华文中宋'; font-size:24px; color='blue'">将目录下全部图片扫描成网页</font></p>


<table width="650" border="0" align="center">
  <tr>
    <td>
	<hr />
			<form name="form1">
			  <p><font color=red>指定本地文件夹(可更改,点击‘搜索’后出现提示点确定或按住‘y’不放直到没有提示框),目录也是文件夹的意思。:</font>			    </p>
			  <p><br />
			    <input type="text" name="localfolder" size="50" value =""> 
			(当前内容为您打开这个网页所在的路径)
			<br />
			<br />
			您只读取当前目录下图片,而不再读取本目录下所有目录中的图片吗?那就点如下按钮:
			<br />
			<input type="button" value ="搜索(不在图片下方显示图片名)" onClick="searchFiles('', 0, 0)">
			<input type="button" value ="搜索(要在图片下方显示图片名)" onClick="searchFiles('', 0, 1)">
			<br />
			<br />
			<br />
			<br />
			您不仅要读取当前目录下的图片,还要读取当前目录下所有目录中的图片吗?那就点如下按钮:
			<br />
			<input type="button" value ="搜索(不在图片下方显示图片名)" onClick="searchFiles('', 1, 0)">
			<input type="button" value ="搜索(要在图片下方显示图片名)" onClick="searchFiles('', 1, 1)">

			    </p>
			</form>
	
	</td>
  </tr>
</table>


</body>
</html>

 

分享到:
评论

相关推荐

    HTML雷达扫描动画

    HTML雷达扫描动画是一种利用HTML5的Canvas元素和JavaScript技术实现的动态效果,它模拟了雷达扫描的过程,通常用于创建交互式或视觉上吸引人的网页元素。在这个项目中,开发者使用了JavaScript来控制Canvas画布上的...

    扫描条形码_微信小程序模板js代码前台前端H5页面源码.rar

    这意味着我们将会讨论如何在微信小程序中利用JavaScript(js)编写前端代码来创建一个条形码扫描的用户界面,并且这个界面可能是基于HTML5(H5)的。 【微信小程序基础知识】 微信小程序是一种轻量级的应用程序,...

    jQuery仿杀毒软件自动扫描检测代码.zip

    CSS文件,即`css`文件夹内的样式表,用于定义网页的外观和布局。在“仿杀毒软件自动扫描”中,CSS将负责设置进度条的样式、按钮的外观,以及整个界面的视觉效果。通过选择器,如类选择器 `.scan-progress` 或 ID ...

    jQuery仿杀毒软件自动扫描检测代码

    总之,“jQuery仿杀毒软件自动扫描检测代码”通过巧妙地运用jQuery库,为用户带来了生动且互动性强的网页体验。通过理解这个项目,开发者可以学习到如何结合HTML、CSS和JavaScript来创建复杂的网页交互效果,提升...

    JS实现新建文件夹功能

    在这一部分中,我们将深入探讨如何使用JavaScript实现新建文件夹的功能。首先,我们需要了解的是,由于浏览器的同源策略限制,通常我们不能使用JavaScript直接在用户的文件系统上创建文件夹。但是,如果配合HTML5的...

    上传图片到指定的文件夹

    开发者需要编写代码来解析请求,接收文件流,然后将其保存到服务器的特定文件夹中。 5. **指定文件夹**:在保存文件时,服务器需要知道目标位置。这可能是通过配置文件、环境变量或动态计算来确定的。为了保持数据...

    网页运用(图片上传控件)

    网页运用中的图片上传控件是Web开发中常见且重要的功能之一,它允许用户在网页上选择并上传图片,常用于社交媒体、博客、电子商务网站等多种场景。在这个特定的案例中,我们看到的是一些可能与实现该功能相关的项目...

    CSS3模拟雷达扫描动画效果

    在提供的压缩包文件中,`index.html`可能是包含上述HTML和CSS代码的网页,而`css`文件夹可能包含了单独的样式表文件,将上述CSS代码分离出来以保持代码组织的整洁性。通过编辑这些文件,你可以进一步定制和优化雷达...

    javascript权威指南电子书及全套源码

    《JavaScript权威指南》是JavaScript编程领域的一本经典之作,由David Flanagan撰写,第六版的中文扫描版在压缩包中提供了全面的JavaScript语言知识。这本书深入浅出地讲解了JavaScript的核心概念,包括语法、类型、...

    HTML5生成图形二维码代码.zip

    HTML5是一种强大的网页开发语言,它在传统HTML的基础上增加了许多新的功能和元素,极大地扩展了网页的交互...对于前端开发者来说,深入理解这个代码实例将有助于提升在网页动态图形生成和JavaScript库应用方面的能力。

    js 条形码扫描.rar

    在标题“js 条形码扫描.rar”中提到的,是利用JavaScript来实现在网页上进行条形码扫描的功能。这在电商、物流、库存管理等领域有着重要的应用,因为它能快速地读取商品信息,提高数据处理的效率。下面将详细探讨...

    纯js带二维码的qq在线客服悬浮代码

    【纯js带二维码的qq在线客服悬浮代码】是一款基于JavaScript技术实现的网页在线客服系统,其特点是能够在网页的右侧面板悬浮显示,并随着用户滚动页面而保持固定位置,增加了用户体验的便捷性。此代码适用于那些希望...

    脚本扫描.zip

    下面,我们将深入探讨脚本扫描的重要性和相关知识点。 1. **脚本语言与安全风险**:在互联网上,JavaScript、VBScript、Python、PHP等脚本语言被广泛应用于网页交互和服务器端处理。然而,这些脚本也可能被恶意用户...

    网页上qq咨询加好友效果的程序代码

    - `images`:这个文件夹很可能包含了一些与网页设计相关的图片资源,比如咨询按钮的图标,或者是用于装饰或指示的图像。这些图片可能被引用在`index.htm`文件中,用于提升用户体验和页面美观度。 在实际部署时,...

    图片上传成功jsp页面不刷新问题

    具体来说,OCR扫描可能会将某些字符识别错误或者漏掉,这需要开发者结合上下文和已有的编程逻辑知识来准确修正,以确保代码的准确性和功能的实现。实际上,在编程时,一定要注意代码的准确性,因为即便是微小的字符...

    网页设计Dreamweaver插入图片详细步骤解析.pdf

    而“OK-***”则可能是一个超链接代码的一部分,用于将图片链接到某个网页地址。 需要注意的是,在使用Dreamweaver进行网页设计时,应当遵循网页设计的最佳实践,比如使用压缩过的图片以减小文件大小,提高网页加载...

    [ASP.NET源码]IP 地址扫描器(使用 QQWry.dat IP 地址库)

    7. **js**:这个文件可能是JavaScript代码,用于增强前端用户体验,例如表单验证、按钮交互效果等。 实现过程中,开发者通常会先加载QQWry.dat文件到内存,因为频繁的磁盘I/O操作会影响性能。然后,通过二分查找...

    retire.js:扫描程序检测已知漏洞JavaScript库的使用

    在应用程序文件夹的源代码文件夹中运行: $ npm install -g retire$ retireGrunt插件在应用程序的构建例程或某些其他自动化工作流程中 。Gulp任务一个Gulp任务的示例,可以在gulpfile中使用它来自动监视和扫描项目...

    树形文件夹动态添加修改

    1. **新建**:用户可以创建新的文件夹,这需要后台代码处理文件系统的创建请求,使用如`System.IO.Directory.CreateDirectory()`的方法创建新文件夹。 2. **删除**:同样,删除操作需要安全地处理文件或文件夹的...

Global site tag (gtag.js) - Google Analytics