首页 > 编程知识 正文

页面动态加载对应的js文件(页面动态加载对应的js文件)

时间:2023-12-22 19:14:06 阅读:319153 作者:FQVM

本文目录一览:

如何在html页面动态加载js文件

html页面动态加载js文件脚本的方法。

1、直接document.write

script language="javascript"

    document.write("script src='test.js'/script");

/script

2、动态改变已有script的src 属性

script src='' id="s1"/script

script language="javascript"

    s1.src="test.js"

/script

3、动态创建 script元素

script

    var oHead = document.getElementsByTagName('HEAD').item(0);

    var oScript= document.createElement("script");

    oScript.type = "text/javascript";

    oScript.src="test.js";

    oHead.appendChild( oScript);

/script

这三种方法都是异步的,所以在采用这类方法动态加载Js的同时,主界面的Js脚本是继续执行的,所以可能出现通过异步加载的Js代码得不到预期的效果的情况。

如何在js文件中动态加载另一个js文件?

1、直接document.write

script language="javascript"

document.write("script src='test.js'/script");

/script

2、动态改变已有script的src属性

script src='' id="s1"/script

script language="javascript"

s1.src="test.js"

/script

3、动态创建script元素

script

var oHead = document.getElementsByTagName('HEAD').item(0);

var oScript= document.createElement("script");

oScript.type = "text/javascript";

oScript.src="test.js";

oHead.appendChild( oScript);

/script

其实原理就是利用dom动态的引入一个js到文件中来~就能和原有的js通信了~

用原生js怎么动态添加一个js文件

如果需要用原生js动态的加载另外一个js文件,可以使用原生js的document.createElement方法创建script节点,然后更改该节点的type和src属性,最后通过appendChild方法将该节点动态添加到html中,这样就可以了,参考代码如下:

var new_element = document.createElement("script");//创建新的script节点new_element.setAttribute("type", "text/javascript");new_element.setAttribute("src", "../js/jquery.js");document.body.appendChild(new_element);//添加到body节点的末尾

上例中是在body的最末尾添加的,当然同样可以在head中添加引用该js的标签:document.head.appendChild(new_element);

怎么在网页中通过jQuery动态加载js代码

用JQ自带的AJAX来动态加载你想要的JS文件

$.getScript("这是你的JS名字.js", function(){

  alert("这是JS加载完了成功的回调函数");

});

这是动态加载的JS文件,ajax必须要有环境才能运行

如何动态的加载js文件

1、直接document.write 

  document.write("script src='test.js'/script");

2、动态改变已有script的src属性 

script src='' id="s1"/script 

script language="javascript" 

    s1.src="test.js" 

/script

3、动态创建script元素 

script 

    var oHead = document.getElementsByTagName('HEAD').item(0); 

    var oScript= document.createElement("script"); 

    oScript.type = "text/javascript"; 

    oScript.src="test.js"; 

    oHead.appendChild( oScript); 

/script

这三种方法都是异步执行的,也就是说,在加载这些脚本的同时,主页面的脚本继续运行,如果用以上的方法,那下面的代码将得不到预期的效果。

4、原理:用XMLHTTP取得要脚本的内容,再创建 Script 对象。 

注意:a.js必须用UTF8编码保存,要不会出错。因为服务器与XML使用UTF8编码传送数据。 

主页面代码: 

script language="JavaScript" 

function GetHttpRequest() 

    if ( window.XMLHttpRequest ) // Gecko 

        return new XMLHttpRequest() ; 

    else if ( window.ActiveXObject ) // IE 

        return new ActiveXObject("MsXml2.XmlHttp") ; 

function AjaxPage(sId, url){ 

    var oXmlHttp = GetHttpRequest() ; 

    oXmlHttp.OnReadyStateChange = function()  

    { 

        if ( oXmlHttp.readyState == 4 ) 

        { 

            if ( oXmlHttp.status == 200 || oXmlHttp.status == 304 ) 

            { 

                IncludeJS( sId, url, oXmlHttp.responseText ); 

            } 

            else 

            { 

                alert( 'XML request error: ' + oXmlHttp.statusText + ' (' + oXmlHttp.status + ')' ) ; 

            } 

        } 

    } 

    oXmlHttp.open('GET', url, true); 

    oXmlHttp.send(null); 

function IncludeJS(sId, fileUrl, source) 

    if ( ( source != null )  ( !document.getElementById( sId ) ) ){ 

        var oHead = document.getElementsByTagName('HEAD').item(0); 

        var oScript = document.createElement( "script" ); 

        oScript.language = "javascript"; 

        oScript.type = "text/javascript"; 

        oScript.id = sId; 

        oScript.defer = true; 

        oScript.text = source; 

        oHead.appendChild( oScript ); 

    } 

AjaxPage( "scrA", "b.js" ); 

alert( "主页面动态加载JS脚本。"); 

alert( "主页面动态加载a.js并取其中的变量:" + str ); 

/script

网页的动态JS在哪找?

可以在开发者工具当中找。

打开开发者工具,然后选择网络(network),在下面的列表就可以看到动态加载的js文件了。如果文件比较多,可以选js进行筛选。

如果不是js文件,是在页面当中的js,可以在开发者工具的元素(elements)面板里面找到文档当中的js。

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。