files_javascript 팁을 포함하려면 javascript를 활성화하세요.

자바스크립트는 강력하지만 한 가지 문제는 다른 js 파일을 포함할 수 없다는 점인데, 다른 비스크립팅 언어에는 기본적으로 이 기능이 있는데 조금 아쉽습니다. 파일을 동적으로 가져오지 않으면 페이지 로드 시간이 심각하게 증가한다는 사실이 점점 더 많이 발견되었습니다. 실험 후에 이 기능을 달성하기 위해 xhtml을 사용하는 방법을 찾았습니다. javascript 파일 및 CSS 스타일 파일 ：

코드 복사 코드는 다음과 같습니다.

함수 $import(path,type,title){
var s,i;
if(type=="js"){
var ss=document.getElementsByTagName("script")
(i=0;i if(ss[i].src && ss[i].src.indexOf(path)!=-1)return; > s=document.createElement("script" );
s.type="text/javascript";
s.src=path;
}else if(type=="css"){
var ls=document.getElementsByTagName(" link");
for(i=0;i if(ls[i].href && ls[i].href .indexOf(path)!=-1) return;
}
s=document.createElement("link")
s.rel="대체 스타일시트"
s.type=" text/css";
s.href=path;
s.title=title;
s.disabled=false;
}
else return;
var head=document. getElementsByTagName("head")[0];
head.appendChild(s)
}

스타일 파일의 경우 기본적으로 가져온 후 즉시 적용됩니다. 이로 인해 이전에 선택한 스타일 효과와 중복되어 혼동이 발생할 수 있습니다. 그래서 제 블로그에서는 스타일 전환 기능을 구현하기 위해 다음과 같은 기능을 사용하고 있습니다.

코드 복사 코드는 다음과 같습니다.

function setStyle(title) {

var i,links,eflag=false;
link = document.getElementsByTagName("link")
for(i=0;links[i]; i ) {
if(links[i]. getAttribute(" rel").indexOf("style") != -1 && link[i].getAttribute("title")) {
link[i].disabled =
if(links[ i].getAttribute("title").indexOf(title) != -1){links[i].disabled = false;eflag=true;}
}
}
if(!eflag) {
$import("skin/" title "/default.css","css",title)
setStyle(title)
}
}

마지막으로 javascript 파일을 원격으로 로드해야 하기 때문에 누군가는 $import() 함수를 호출한 후 즉시 $import() 이후의 명령문을 실행할 것인지 아니면 로딩이 완료될 때까지 기다릴 것인지 묻는 경우가 있습니다. 후속 명령문을 실행하기 전에. 대략적인 테스트를 해본 결과 로딩이 완료된 후 후속 명령문이 실행되고, 로드된 js에 즉시 실행해야 할 코드가 있으면 $import() 다음 명령문보다 먼저 실행되는 것으로 나타났습니다. 이는 우리가 원하는 결과이기도 합니다. 왜냐하면 $import() 이후에 로드된 파일에서 함수를 호출할 수 있기 때문입니다.