>웹 프론트엔드 >JS 튜토리얼 >js 파일에 매개변수 전달(자세한 설명)_javascript 기술

js 파일에 매개변수 전달(자세한 설명)_javascript 기술

WBOY
WBOY원래의
2016-05-16 16:42:071585검색

1. 전역 변수를 사용하세요

이것은 Google Adsense와 같은 가장 간단한 방법입니다.

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

4ec11beb6c39d0703d1751d203c17053 google_ad_client ='pub-3741595817388494' 2cacc6d41bbb37262a98f745aa00fbf0 dbee69d91dfbc6b08f31d07091607e422cacc6d41bbb37262a98f745aa00fbf0

단점은 전역 변수가 도입된다는 점입니다. 파일을 소개하는 방법에는 두 가지 변형이 있습니다.

// 变体1:用document.write输出
 <script type="text/javascript"> 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操作append到head里 
<script type="text/javascript"> 
G_BEACON_ATP ='category=&userid=&channel=112ad_id=';
 document.getElementsByTagName('head')[0].appendChild(document. createElement('script')).src='http://taobao.com/atp.js'; 
</script> // 注意:上面的代码是根据实际应用虚拟的示范代码

참고: 변형 1에는 일반적인 작성 방법이 많이 있습니다.

<script type="text/javascript"> 
// 直接转义即可: 
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를 얻어서 구문 분석합니다

모든 변수와 비교하여 다음과 같은 매개변수를 전달하는 것을 선호합니다.

13ae44ffe4aa4df7af013a12fb8158d82cacc6d41bbb37262a98f745aa00fbf0

핵심 문제는 src 속성을 얻는 방법입니다.

첫 번째 방법은 스크립트에 id 속성을 추가하고 해당 id를 통해 현재 스크립트를 가져온 다음 정규식을 사용하여 src에서 매개변수를 추출하는 것입니다. 단점은 HTML 4.01 사양에서 SCRIPT 요소에 id 속성이 없다는 것입니다. 이 단점은 단점이 아닙니다. 결국 표준이 없는 것보다 표준을 믿는 것이 더 낫습니다.

방법 2는 js 파일 이름을 Hook으로 사용하는 것입니다. js 코드에 document.getElementsByTagName('script')를 전달한 후 현재 js 파일을 정규식으로 일치시킵니다. 이 방법은 매우 정통적이지만 고유한 파일 이름이 필요합니다. 단점은 코드가 많고, 다듬어지지 않고, 성능에 약간의 영향을 미친다는 점입니다.

방법 3은 방법 1을 기반으로 하며 사용자 정의 속성 데이터를 추가하기만 하면 됩니다.

94c14f1ae29f3592bfda9eb585dbd14b2cacc6d41bbb37262a98f745aa00fbf0

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 > 방법 2

요약: 표준에 관심이 있다면 방법 4를 추천합니다. 저처럼 표준을 완전히 준수할 필요를 느끼지 않는다면 방법 3을 권장합니다.

테스트 프로그램 작성

<!DOCTYPE html>
<html>
<script src="a2.js">
</script>
<script src="a2.js">
</script>
<script src="a2.js">
</script>
</html>

a2.js

var scripts = document.getElementsByTagName('script'); var currentScript = scripts.length;alert(currentScript);

별도 인쇄

1 2 3

3. 영감 계획

저처럼 John Resig의 열혈 팬이라면 작년 8월에 뜨겁게 화제가 되었던 '스크립트 태그 저하'를 아직도 기억하실 겁니다. John Resig는 우리에게 상상력의 문을 열어주었습니다. 이 기사의 문제를 해결하기 위해 다음과 같은 "악한 방법"을 사용할 수도 있습니다.

ae47fa971796540d6040c77d18703721 TB.SomeApp.scriptArgs ='a=b&c=d';

test.js 파일에서:

TB = {}; TB.SomeApp = {}; 
var scripts = document.getElementsByTagName("script");
eval(scripts[ scripts.length - 1 ].innerHTML);

이런 방식으로 매개변수가 TB.SomeApp.scriptArgs 변수에 저장됩니다.

매개변수가 많지 않은 경우 다음과 같이 할 수도 있습니다.

ae47fa971796540d6040c77d18703721a=b&c=d2cacc6d41bbb37262a98f745aa00fbf0

js 파일 내:

var scripts = document.getElementsByTagName("script"); 
var scriptArgs = scripts[ scripts.length - 1 ].innerHTML.replace(/[s]/g, '');

상상력은 끝이 없습니다. onload를 사용할 수도 있습니다.

3959d0a17b69883088dd6228aa01b50a2cacc6d41bbb37262a98f745aa00fbf0

js 파일에 함수를 정의하세요.

TB = {}; 
TB.SomeFun = function(arg) { 
//code
};

위 코드는 IE가 아닌 브라우저에서도 올바르게 실행될 수 있습니다. 멍청한 IE의 경우 몇 줄의 코드를 추가해야 합니다:

if(window.ActiveXObject) { 
var scripts = document.getElementsByTagName('script'); 
eval(scripts[scripts.length - 1].getAttribute('onload'));
}
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.