关于document.scripts

作者: _palm | 来源:发表于2017-02-15 16:59 被阅读87次

    laydate.js日期插件源码中,有一段代码会自动创建标签然后引入自身使用css文件,有一个获取laydate.js文件路径函数:

    //获取组件存放路径
    Dates.getPath = (function(){
        var js = document.scripts, jsPath = js[js.length - 1].src;
        return config.path ? config.path : jsPath.substring(0, jsPath.lastIndexOf("/") + 1);
    }());
    

    我第一次见到document.scripts, 然后查询得知,这会返回全部script的HTMLCollection
    对象,这个对象类似数组,但是并不是真正的数组.

    看到js[js.length - 1].src 这行代码,我立马就想给这个插件提一个bug, 假如,最后一个<script>标签的src值不对或空,那需要的css文件不就加载失败了吗?

    带着疑惑我进行了一些列的测试, 比如,我在最后又引入了别的js文件,例如 jquery:

    <script type="text/javascript" src="../jquery/jquery-1.11.0.min.js"></script>
    

    但是取到的依然是<script type="text/javascript" src="../laydate.js"></script>
    我很疑惑, 各种找资料,然后又把laydate.js位置移动到不同的地方, 最后发现总能取到laydate.js引入之前的所有<script>标签,于是我大概明白了:
    这些代码执行都是阻塞的, 例如,在a.js中调用 document.scripts ,则只能获取到<script type="text/javascript" src="../a.js"></script>之前的<script>标签,后面的内容是无法获取到.

    这个问题总算是想明白了, 于是js[js.length - 1]总是能获取到document.scripts调用所在的js 文件.

    参考资料: Document.scripts

    相关文章

      网友评论

        本文标题:关于document.scripts

        本文链接:https://www.haomeiwen.com/subject/upvqwttx.html