当前位置: 首页 > Web前端 > HTML

js实用方法record-js动态加载css和js脚本文件

时间:2023-04-02 14:05:19 HTML

js实用方法记录——动态加载css/js1.动态加载js文件到head标签,执行回调方法调用:dynamicLoadJs('http://www.yimo.link/static/j...',function(){alert('加载成功')});/***动态加载JS*@param{string}url脚本地址*@param{function}callback回调函数*/functiondynamicLoadJs(url,callback){varhead=document.getElementsByTagName('head')[0];varscript=document.createElement('脚本');script.type='文本/javascript';脚本.src=url;if(typeof(callback)=='function'){script.onload=script.onreadystatechange=function(){if(!this.readyState||this.readyState==="loaded"||this.readyState===“完成”){回调();script.onload=script.onreadystatechange=null;}};}head.appendChild(脚本);}2。动态加载css文件到head标签,执行回调方法调用:dynamicLoadCss('http://www.yimo.link/static/c...',function(){alert('加载成功')})/***动态加载CSS*@param{string}url样式地址*/functiondynamicLoadCss(url){varhead=document.getElementsByTagName('head')[0];varlink=document.createElement('链接');link.type='文本/css';link.rel='样式表';link.href=网址;head.appendChild(链接);}3。动态加载脚本文件参考:http://www.cnblogs.com/yuanke.../***动态加载css脚本*@param{string}cssTextcssstyle*/functionloadStyleString(cssText){varstyle=document.创建元素(“样式”);style.type="文本/css";try{//firefox、safari、chrome和Operastyle.appendChild(document.createTextNode(cssText));}catch(ex){//IE早期浏览器需要使用样式元素stylesheet属性的cssText属性style.styleSheet.cssText=cssText;}document.getElementsByTagName("head")[0].appendChild(风格);}//测试varcss="body{color:blue;}";loadStyleString(css);/***动态添加加载js脚本*@param{string}代码js脚本*/functionloadScriptString(code){varscript=document.createElement("script");script.type="文本/javascript";try{//firefox、safari、chrome和Operascript.appendChild(document.createTextNode(code));}catch(ex){//早期的IE浏览器需要使用script的text属性来指定javascript代码。script.text=代码;}document.getElementsByTagName("head")[0].appendChild(脚本);}//测试vartext="functiontest(){alert('test');}";loadScriptString(文本);测试();4、动态加载iframe到body标签,执行回调方法调用:dynamicLoadIframe('http://www.yimo.link',function(){alert('加载成功')},'');/***动态加载iframe*@param{string}url脚本地址*@param{function}callback回调函数*@param{string}style加载样式*/functiondynamicLoadIframe(url,callback,style){varbody=document.getElementsByTagName('正文')[0];variframe=document.createElement('如果拉姆');iframe.src=url;iframe.style=style||'display:none;width:0px;height:0px;';if(typeof(callback)=='function'){iframe.onload=iframe.onreadystatechange=function(){if(!this.readyState||this.readyState==="loaded"||this.readyState===“完成”){回调();iframe.onload=iframe.onreadystatechange=null;}};}body.appendChild(iframe);}5.M站下载/打开app方法测试:openApp('ios页面','**.apk','metools://home');functionopenApp(iosDownUrl,andDownUrl,appUrl){varua=navigator.userAgent.toLowerCase();if(/iphone|ipad|ipod/.test(ua)){//ios跳转到storewindow.location.href=iosDownUrl;返回;}if(ua.indexOf("micromessenger")>-1){//微信打不开其他应用window.location.href=andDownUrl;返回;}if(/android/.test(ua)){//Android手机尝试调用appif(!appUrl){console.log('未指定要打开的App,请参考http://www.oschina.net/code/snippet_256033_35330/');返回;}varsu=appUrl;//"metools://index";//来自定义协议varn=setTimeout(function(){window.location.href=andDownUrl},500);varr=document.createElement("iframe");r.src=su;r.onload=function(){console.log('iframeload')clearTimeout(n);r.parentNode.removeChild(r);window.location.href=su;};r.setAttribute("style","display:none;");文档。body.appendChild(r);返回;}window.location.href=andDownUrl;}6.query参数转换参考:https://github.com/nicejade/a...query参数转换对象导出函数query(search){letstr=search||window.location.searchletobjURL={}str.replace(newRegExp('([^?=&]+)(=([^&]*))?','g'),($0,$1,$2,$3)=>{objURL[$1]=$3})返回objURL}7、使用:query('?v=1')objecttoqueryparameterfunctionqueryString(url,query){letstr=[]for(letkeyinquery){str.push(key+'='+query[key])}让paramStr=str.join('&')返回paramStr?`${url}?${paramStr}`:url}