Yipin Sky Web Development Code Station ASP 및 웹 개발과 관련된 기타 클래식 코드 수집 블로그 - ASP 통신 QQ 그룹 12814238(전체) 14725152(공개) 홈페이지 ASPJS/AJAX 재구성 및 최적화 포괄적인 코드 데이터베이스 수집 및 시청각 엔터테인먼트 운영 체제 공유 이전 기사 | 다음 기사 JS/AJAX
JavaScript에서 JavaScript 파일에 매개변수를 전달하는 방법 작성자: Yipin 날짜: 2009-03-23
글꼴 크기: 작게, 중간,
크게
이는 Google Adsense와 같은 전역 변수를 사용하는 가장 간단한 방법입니다.
프로그램 코드
<스크립트 유형="텍스트/자바스크립트">
google_ad_client = 'pub-3741595817388494';
</script>
<script type="text/javascript" src=" http://pagead2 .
googlesyndication.com/pagead/show_ads.js"></script>
단점은 전역 변수가 도입된다는 것입니다. 파일을 소개하는 방법에는 두 가지 변형이 있습니다.
프로그램 코드
// 변형 1: document.write를 사용하여 출력
<스크립트 유형="텍스트/자바스크립트">
google_ga_id = 'g6u7un8646xx';
document.write(unescape('%3Cscript type="text/javascript" src=
" http://www.google-analytics.com/ga.js"%3E%3C/script%3E' ));
</script>
프로그램 코드
// 변형 2: DOM 작업을 사용하여 헤드에 추가
<스크립트 유형="텍스트/자바스크립트">
G_BEACON_ATP = 'category=&userid=&channel=112ad_id=';
document.getElementsByTagName('head')[0].appendChild(document.
createElement('script')).src='http://taobao.com/atp.js';
</script>
참고: 위 코드는 실제 애플리케이션을 기반으로 한 가상 데모 코드입니다
. 참고: 변형 1은 많은 애플리케이션에서 사용됩니다.
프로그램 코드
<스크립트 유형="텍스트/자바스크립트">
// 그냥 직접 탈출하세요:
document.write('<script type="text/javascript" src="test.js"></script>');
// 또는 Yahoo! 홈페이지처럼:
document.write('<scr' + 'ipt type="text/javascript" src="test.js"></scr' + 'ipt>');
</script>
2.
스크립트 요소와 모든 변수의 src를 얻고 구문 분석하는 것과 비교하여 다음과 같이 매개 변수를 전달하는 것을 선호합니다.
프로그램 코드
<script type="text/javascript" src="test.js?a=b&c=d"></script>
핵심 문제는 src 속성을 얻는 방법입니다.
첫 번째 방법은 스크립트에 id 속성을 추가하고 id를 통해 현재 스크립트를 가져온 다음 정규식을 사용하여 src에서 매개변수를 추출하는 것입니다. 단점은 HTML 4.01 사양에서 SCRIPT 요소에 id 속성이 없다는 것입니다. 이 단점은 단점이 아닙니다. 결국 표준이 없는 것보다 표준을 믿는 것이 더 낫습니다.
두 번째 방법은 js 파일 이름을 Hook으로 사용하는 것입니다. js 코드에 document.getElementsByTagName('script')를 전달한 후 현재 js 파일을 일반 규칙에 따라 일치시킵니다. 이 방법은 매우 정통적이지만 고유한 파일 이름이 필요합니다. 단점은 코드가 많고, 다듬어지지 않고, 성능에 약간의 영향을 미친다는 점입니다.
세 번째 방법은 방법 1을 기반으로 사용자 정의 속성 데이터를 추가하는 것입니다.
프로그램 코드
<script id="testScript" type="text/javascript" src="test.js" data="a=b&c=d"></script>
test.js 파일에서 전달된 매개변수는 다음 줄을 통해 가져옵니다.
프로그램 코드
var scriptArgs = document.getElementById('testScript').getAttribute('data');
네 번째 방법은 js의 순차적 실행 메커니즘을 사용하는 것입니다(js 파일은 동기식 또는 비동기식으로 로드할 수 있지만 실행 시에는 문서 흐름의 순서대로 실행되어야 합니다). js 파일이 실행될 때 "로드된" js 파일 중 마지막 파일이어야 합니다.
프로그램 코드
var scripts = document.getElementsByTagName('script');
var currentScript = scripts[scripts.length - 1];
방법 4는 방법 2보다 더 기민하고 천재적입니다.
코드 단순화 및 성능 측면에서 방법 3>방법 1>방법 4>방법 2
요약: 표준에 관심이 있다면 방법 4를 추천합니다. 3을 권장합니다.
3. 영감 계획 저처럼 John Resig의 충성스러운 팬이라면 작년 8월에 많은 논의가 있었던 "Degrading Script Tags"를 아직도 기억하실 것입니다. John Resig는 우리에게 상상력의 문을 열어주었습니다. 이 기사의 문제에 대해 다음과 같은 "악한 방법"을 사용하여 이를 달성할 수도 있습니다.
프로그램 코드
<script type="text/javascript" src="test.js">
TB.SomeApp.scriptArgs = 'a=b&c=d';
</script>
test.js 파일에서:
프로그램 코드
TB = {}; TB.SomeApp = {};
var scripts = document.getElementsByTagName("script");
eval(scripts[scripts.length - 1].innerHTML);
이는 매개변수를 TB.SomeApp.scriptArgs 변수에 저장합니다.
매개변수가 많지 않은 경우 다음과 같이 할 수도 있습니다.
프로그램 코드
<script type="text/javascript" src="test.js">a=b&c=d</script>
js 파일:
프로그램 코드
var scripts = document.getElementsByTagName("script");
var scriptArgs = scripts[ scripts.length - 1 ].innerHTML.replace(/[s]/g, '');
상상력은 끝이 없습니다. onload를 사용할 수도 있습니다.
프로그램 코드
<script type="text/javascript" src="test.js" xxxxx="TB.SomeFun('a=b&c=d')"></script>
js 파일에 함수를 정의하면 됩니다.
프로그램 코드
결핵 = {};
TB.SomeFun = function(arg) { //코드 };
위 코드는 IE가 아닌 브라우저에서도 올바르게 실행될 수 있습니다. 즉, 몇 줄의 코드를 추가해야 합니다.
프로그램 코드
if(window.ActiveXObject) {
var scripts = document.getElementsByTagName('script');
eval(scripts[scripts.length - 1].getAttribute('onload'));
}
우리가 발굴의 정신을 계속 이어가는 한, 더 많은 영감을 주는 솔루션이 있을 것이라고 믿습니다. -.-
위의 솔루션을 요약하면 어떤 솔루션이 가장 좋습니까? 내 대답은 이렇습니다. 최고는 없고 가장 적합한 것만 있습니다! 다양한 적용 분야와 다양한 개념에 따라 "좋은"에 대한 정의가 다르기 때문입니다.
예를 들어, 나의 현재 철학은 표준을 완전히 준수할 필요는 없다는 것입니다. 전역 변수의 경우 우리가 피해야 할 것은 남용이지 사용이 아닙니다. 따라서 가장 간단하고 성능이 가장 좋은 전역 변수 솔루션을 선택하겠습니다.