`
truelove12358
  • 浏览: 77522 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

JS获取自身所在文件的路径

 
阅读更多
很多时候我们都需要在js文件中获取该文件的详细路径,以便根据其他文件与该js的相对位置计算并设置其他一些文件如图片或样式或脚本的目录路径。我们一般都这样做:

假设外部js文件的文件名为:test.js,则在test.js中都这样写:

var js=document.scripts;
var jsPath;
for(var i=0;i<js.length;i++){
if(js[i].src.indexOf("test.js")>-1){
jsPath=js[i].src.substring(0,js[i].src.lastIndexOf("/")+1);
}
}
alert(jsPath);

或者为了提高效率,这样写

var js=document.scripts;
var jsPath;
for(var i=js.length;i>0;i--){
if(js[i-1].src.indexOf("test.js")>-1){
jsPath=js[i-1].src.substring(0,js[i-1].src.lastIndexOf("/")+1);
}
}
alert(jsPath);



这种思路很清晰,根据文件名获取引用的文件的src属性并进行判断截取即可。

但这种办法有以下两个缺点:
1、需要遍历页面的js文件,有时可能效率会比较低。
2、如果页面中出现目录不同的重名的js文件则可能判断错误。

其实我们可以有更简单的办法来准确获取路径,这是在一次js测试突然发现并幡然醒悟的。

var js=document.scripts;
js=js[js.length-1].src.substring(0,js[js.length-1].src.lastIndexOf("/")+1);
alert(js);




直接使用js.length?这会正确吗?
其实仔细想想,由于判断路径的js代码一般都直接放在js文件中而不是函数中,所以当加载该js文件时会立即执行其中的语句,而执行此语句时所获取到的js文件数目正好是js.length-1,因为页面后面的js文件还没有加载,所以该处的js文件获取的数目并不是页面所有的js文件的数目。这样一来,获取路径就无需再遍历了,而且文件判断也无需文件名,判断更加准确(js.length-1永远都是其文件本身)。

补充: 使用时发现当引入的文件路径是这样的

<script language="Javascript" src="C:\Documents and Settings\XmlPC\html\calendar\AX_Encoder.js"></script>

没有用 / 而用\ 时,上面的方法就行不通了,而且改变为lastIndexOf("\\")也不行,找到的解决办法是:

var js=document.scripts;
var jsPath;
for(var i=js.length;i>0;i--){
if(js[i-1].src.indexOf("AX_Encoder.js")>-1){
if(js[i-1].src.lastIndexOf("\\")<0){
jsPath=js[i-1].src.substring(0,js[i-1].src.lastIndexOf("/")+1);
}else{
jsPath=js[i-1].src.substring(0,js[i-1].src.lastIndexOf("\\")+1);
}
break;
}
}
alert("jsPath"+jsPath);

这样就不论是 \ 还是 / 都可以取到正确路径,同时需要注意JS的文件名不要重复或被包含,起个特殊的文件名就OK了。

分享到:
评论

相关推荐

    在html页面使用JavaScript实行文件上传到本地服务器并获取文件所在路径

    使用JavaScript实现文件上传到本地服务器并获取到上传后文件所在路径,是由到JavaScript,java以及html页面。这个比较好,不是在jsp上获取路径,jsp太简单了,而且过时了,所以就在html页面实现了下功能,我主要是做...

    实例16 如何获取当前程序所在的文件夹

    若要获取可执行文件路径,可以结合`fs`模块和`path`模块来实现。 7. **Go**: Go语言提供了`os`包,其中`os.Executable()`函数可以获取到当前程序的完整路径。 8. **Ruby**: Ruby中,`__FILE__`常量会返回包含...

    js获取系统的根路径实现介绍

    以上就是通过JavaScript获取系统根路径的方法。在实际应用中,你可能需要根据自己的服务器配置和项目需求,对根路径进行适当的调整。例如,如果你的网站部署在服务器的某个子目录下,那么根路径可能就是那个子目录的...

    Node.js实现在目录中查找某个字符串及所在文件

    如果找到匹配项,它将打印出文件路径。 ```javascript function check(fileName) { var data = readFile(fileName); var exc = new RegExp(lookingForString); if (exc.test(data)) console.log(fileName); } ...

    pdf.js前端插件,用于在线预览pdf文件

    - **设置basePath**:描述中的`basePath`是指PDF.js库所在的路径,它用于构造预览PDF的URL。 - **加载文件**:使用`window.open()`函数创建新窗口,并传递预览参数,如示例所示。`fileUrl`是待预览PDF的URL。 - *...

    CSS与JS中的相对路径引用简单介绍

    在Web开发过程中,正确使用CSS和JavaScript文件中的相对路径是确保资源能被正确引用的关键。相对于绝对路径,相对路径具有灵活性和简洁性的优点,但其引用基准在CSS和JavaScript中是不同的。下面详细介绍这两个方面...

    nodejs取得当前执行路径的方法

    了解并正确使用这些方法对于解决涉及到文件路径的问题至关重要,特别是在开发涉及多层级目录结构的应用时。 总结,Node.js提供了`process.cwd()`、`__dirname` 和 `process.execPath` 三个内置工具来获取不同类型的...

    百度地图api获取周边配套数据地点查找周围环境银行、公交、医院、购物、学校等)

    百度地图API是一个开放的服务平台,它允许开发者通过调用接口来获取地图数据、地理编码、路径规划、定位等服务。在本案例中,我们主要关注的是获取周边兴趣点(POI,Point of Interest)的功能。 要实现这一功能,...

    obsidian-show-file-path:黑曜石插件,在状态栏中显示当前文件的文件路径

    《黑曜石插件:在状态栏中显示文件路径的实现与应用》 在数字化笔记领域,黑曜石(Obsidian)凭借其强大的链接和知识管理功能,深受广大用户喜爱。为了进一步提升用户体验,开发者们为其创建了一系列插件,其中...

    大名鼎鼎SWFUpload- Flash+JS 上传

    选定的文件的上传和它所在页面、表单是独立的。每个文件都是单独上传的,这就保证了服务端脚本能够在一个时间点更容易地处理单个文件。虽然Flash提供了上传服务,但是页面并不会提交或者重新载入。相比于标准的...

    Webpack插件用于验证编译中所有外部依赖项的许可证并将它们输出到文件中

    在实际使用时,需要在Webpack配置文件(通常是`webpack.config.js`)中添加相应的插件配置,指定输出文件路径和其他个性化设置。 在`license-checker-webpack-plugin-master`这个压缩包中,可能包含了该插件的源码...

    pdfjs_1.1.159添加在指定页码使用关键词检索

    PDF.js 是一个开源的JavaScript库,由Mozilla维护,主要用于在Web浏览器中渲染PDF文档,无需任何插件。这个项目的目标是提供一个高质量、跨平台的PDF查看器,使得用户可以在任何支持HTML5的浏览器上查看PDF文件。在...

    文件上传OSS.rar

    【uni-app 文件上传OSS详解】 uni-app是一个开源的跨平台开发框架,它允许开发者用一套代码编写应用,同时适配iOS、Android、H5、...通过理解以上步骤,你可以灵活地在自己的uni-app项目中实现文件上传到云端的功能。

    网盘文件免费外链 v2.0.rar

    1.最近有很多网友误把本程序提取理解成解析,这个是理解错误的,本程序的提取是指把百度或者威盘上的文件下载到程序所在的服务器,然后构造一个真实的外链, 不是你们想的把文件存储在第三方网盘的,而是真实存储在程序...

    VBS脚本和BAT批处理自身删除的方法

    - `%~dp0`获取文件所在的完整路径。 - `%~nx0`仅获取文件名。 2. **自删除示例**: - 使用`del "%~nx0"`可以直接删除当前批处理文件自身。 3. **注意事项**: - 如果文件名中包含空格,确保使用引号将整个路径...

    js-sdk/alioss-upload + uniapp阿里云上传oss

    `js-sdk/alioss-upload`则是针对阿里云OSS的JavaScript SDK,用于在Web端实现文件上传的功能。现在我们将深入探讨如何在uniapp项目中结合这两个工具实现阿里云OSS的文件上传。 首先,你需要在阿里云控制台创建一个...

    JS实现的input选择图片本地预览功能示例

    而JavaScript代码部分是这个功能的核心所在。文档中定义了一个函数Id(id),用于根据id获取页面中的DOM元素。changeToop函数用于处理文件选择后触发的onchange事件,根据选择的文件情况,调用preImg函数来加载并展示...

    thinkphp常见路径用法分析

    在ThinkPHP中,公共资源目录通常用于存放图片、CSS、JavaScript等静态资源文件。例如,如果当前公共资源目录位于项目根目录下的public文件夹,那么__PUBLIC__就会指向这个路径。使用时,可以通过__PUBLIC__/images/...

    JavaScript如何获取到导航条中HTTP信息

    在了解如何使用JavaScript获取导航条中的HTTP信息之前,首先需要明确导航条通常指的是浏览器的地址栏信息。通过JavaScript,我们可以获取到许多与当前页面地址相关的信息,比如URL地址、主机名、端口、协议、路径等...

Global site tag (gtag.js) - Google Analytics