Yipin Sky Web Development Code Station ASP และบล็อกคอลเลกชันโค้ดคลาสสิกอื่น ๆ ที่เกี่ยวข้องกับการพัฒนาเว็บ - การสื่อสาร ASP กลุ่ม QQ 12814238 (เต็ม) 14725152 (เปิด) หน้าแรก ASPJS/AJAX การสร้างใหม่และการเพิ่มประสิทธิภาพการรวบรวมฐานข้อมูลรหัสที่ครอบคลุมและแบ่งปันระบบปฏิบัติการความบันเทิงภาพและเสียง บทความก่อนหน้า |. ถัดไป บทความ JS/AJAX
วิธีส่งพารามิเตอร์ไปยังไฟล์ JavaScript ใน JavaScript ผู้แต่ง: Yipin วันที่: 23-09-09-2009
ขนาดตัวอักษร: เล็ก กลาง
ใหญ่
นี่เป็นวิธีที่ง่ายที่สุดในการใช้ตัวแปรร่วม เช่น Google Adsense:
รหัสโปรแกรม
<script type="text/javascript">
google_ad_client = 'pub-3741595817388494';
</สคริปต์>
<script type="text/javascript" src=" http://pagead2 .
googlesyndication.com/pagead/show_ads.js"></script>
ข้อเสียคือมีการแนะนำตัวแปรโกลบอล วิธีการแนะนำไฟล์มีสองรูปแบบ:
รหัสโปรแกรม
// ตัวแปร 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' ));
</สคริปต์>
รหัสโปรแกรม
// รูปแบบที่ 2: ใช้การดำเนินการ DOM เพื่อต่อท้ายส่วนหัว
<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';
</สคริปต์>
หมายเหตุ: โค้ดด้านบนเป็นโค้ดสาธิตเสมือนตามแอปพลิเคชันจริง
หมายเหตุ: ตัวแปร 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>');
</สคริปต์>
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 หลังจากส่ง document.getElementsByTagName('script') ในโค้ด js แล้ว ไฟล์ js ปัจจุบันจะถูกจับคู่ตามกฎปกติ วิธีนี้เป็นแนวทางดั้งเดิมมาก แต่ต้องใช้ชื่อไฟล์ที่ไม่ซ้ำกัน ข้อเสียคือโค้ดมีจำนวนเยอะ ไม่ได้รับการปรับแต่ง และมีผลกระทบต่อประสิทธิภาพเล็กน้อย
วิธีที่สามคือเพียงเพิ่มข้อมูลแอตทริบิวต์ที่กำหนดเองตามวิธีที่หนึ่ง:
รหัสโปรแกรม
<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 = document.getElementsByTagName('script');
var currentScript = สคริปต์ [scripts.length - 1];
วิธีที่สี่มีความคล่องแคล่วและเป็นอัจฉริยะมากกว่าวิธีที่สอง
ในแง่ของการทำให้โค้ดง่ายขึ้นและประสิทธิภาพ วิธีที่ 3>วิธีที่ 1>วิธีที่ 4>วิธีที่ 2
สรุป: หากคุณสนใจเกี่ยวกับมาตรฐาน ฉันขอแนะนำวิธีที่ 4 ถ้าเหมือนฉัน คุณรู้สึกว่าไม่จำเป็นต้องปฏิบัติตามมาตรฐานอย่างสมบูรณ์ วิธีการ 3 ขอแนะนำ.
3. แผนแรงบันดาลใจ หากคุณเป็นแฟนตัวยงของ John Resig เช่นฉัน คุณอาจยังจำ "แท็กสคริปต์ที่ลดระดับ" ที่มีการพูดคุยกันอย่างมากในเดือนสิงหาคมปีที่แล้ว John Resig เปิดประตูแห่งจินตนาการให้เรา สำหรับปัญหาของบทความนี้ คุณสามารถใช้ "วิธีชั่วร้าย" ต่อไปนี้เพื่อให้บรรลุเป้าหมายได้:
รหัสโปรแกรม
<script type="text/javascript" src="test.js">
TB.SomeApp.scriptArgs = 'a=b&c=d';
</สคริปต์>
ในไฟล์ test.js:
รหัสโปรแกรม
TB = {}; TB.SomeApp = {};
สคริปต์ var = document.getElementsByTagName("script");
eval(สคริปต์[scripts.length - 1].innerHTML);
ซึ่งจะเก็บพารามิเตอร์ไว้ในตัวแปร TB.SomeApp.scriptArgs
เมื่อมีพารามิเตอร์ไม่มากนัก คุณสามารถทำได้:
รหัสโปรแกรม
<script type="text/javascript" src="test.js">a=b&c=d</script>
ไฟล์ .js:
รหัสโปรแกรม
สคริปต์ var = 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 สำหรับคนโง่ คุณต้องเพิ่มโค้ดสองสามบรรทัด:
รหัสโปรแกรม
ถ้า (window.ActiveXObject) {
สคริปต์ var = document.getElementsByTagName('script');
eval(สคริปต์[scripts.length - 1].getAttribute('onload'));
-
ตราบใดที่เรายังคงสืบสานจิตวิญญาณแห่งการขุดค้นต่อไป ผมเชื่อว่าจะมีวิธีแก้ปัญหาที่สร้างแรงบันดาลใจอีกมากมาย -.-
หลังจากสรุปวิธีแก้ปัญหาข้างต้นแล้ว วิธีแก้ปัญหาใดดีที่สุด? คำตอบของฉันคือ: ไม่มีดีที่สุด มีแต่เหมาะสมที่สุดเท่านั้น! เพราะสำหรับการใช้งานที่แตกต่างกันและแนวคิดที่แตกต่างกัน คำจำกัดความของ "ดี" จึงแตกต่างกัน
ตัวอย่างเช่น ปรัชญาปัจจุบันของฉันคือไม่จำเป็นต้องปฏิบัติตามมาตรฐานทั้งหมด สำหรับตัวแปรทั่วโลก สิ่งที่เราต้องหลีกเลี่ยงคือการละเมิด ไม่ใช่การใช้ ดังนั้น ฉันจะเลือกโซลูชันตัวแปรส่วนกลางซึ่งง่ายที่สุดและมีประสิทธิภาพดีที่สุด