وثيقة جافا سكريبت.كتابة أمر تنفيذ البرنامج النصي المضمن

Question

لدي البرنامج النصي التالي، حيث الأول والثالث document.writeline ثابتة و يتم إنشاء الثاني:

<script language="javascript" type="text/javascript">
document.write("<script language='javascript' type='text/javascript' src='before.js'><\/sc" + "ript>");
document.write("<script language='javascript' type='text/javascript'>alert('during');<\/sc" + "ript>");
document.write("<script language='javascript' type='text/javascript' src='after.js'><\/sc" + "ript>");
</script>

سيتم عرض Firefox وChrome قبل, خلال و بعد, ، بينما يظهر Internet Explorer لأول مرة خلال وعندها فقط يظهر قبل و بعد.

لقد صادفت مقال ينص على أنني لست أول من يواجه هذا، ولكن هذا لا يجعلني أشعر بأي تحسن.

هل يعرف أحد كيف يمكنني ضبط الترتيب ليكون حتميًا في جميع المتصفحات، أو اختراق IE للعمل مثل جميع المتصفحات الأخرى العاقلة؟

تحفظات:مقتطف الشفرة عبارة عن نسخة بسيطة جدًا.يتم إنشاؤه على الخادم والنص الثاني هو الشيء الوحيد الذي يتغير.إنه نص طويل والسبب في وجود نصين قبله وبعده هو أن المتصفح سيقوم بتخزينهما مؤقتًا وسيكون الجزء الديناميكي من الكود صغيرًا قدر الإمكان.وقد يظهر أيضًا عدة مرات في نفس الصفحة باستخدام تعليمات برمجية مختلفة تم إنشاؤها.

Answer 1

لقد وجدت إجابة أكثر تروق لي:

<script language="javascript" type="text/javascript">
document.write("<script language='javascript' type='text/javascript' src='before.js'><\/sc" + "ript>");
document.write("<script defer language='javascript' type='text/javascript'>alert('during');<\/sc" + "ript>");
document.write("<script defer language='javascript' type='text/javascript' src='after.js'><\/sc" + "ript>");
</script>

سيؤدي هذا إلى تأجيل تحميل كليهما خلال و بعد حتى تنتهي الصفحة من التحميل.

أعتقد أن هذا جيد بقدر ما أستطيع الحصول عليه.نأمل أن يتمكن شخص ما من تقديم إجابة أفضل.

Answer 2

لا، هذا هو سلوك Internet Explorer.

إذا قمت بإرفاق البرامج النصية ديناميكيًا، فسيقوم IE وFirefox وChrome بتنزيل البرامج النصية بطريقة غير متزامنة.

سينتظر Firefox وChrome حتى تعود جميع طلبات المزامنة، ثم سينفذان البرامج النصية بالترتيب الذي تم إرفاقها به في DOM، لكن IE ينفذ البرامج النصية بالترتيب الذي تم إرجاعها به عبر السلك.

نظرًا لأن التنبيه يستغرق وقتًا أقل "لاسترجاعه" مقارنة بملف جافا سكريبت خارجي، فمن المحتمل أن يفسر هذا السلوك الذي تراه.

من كريستوفر هنريكسون مشاركة حول موضوع تحميل البرنامج النصي غير المتزامن:

في هذا السيناريو ، ستقوم Firefox بتنزيل كلا البرامج النصية ، لكن Internet Explorer ستنفذها أيضًا بالترتيب الذي ينهيونه في التنزيل في حين يقوم Firefox بتنزيلها بشكل غير متزامن ولكن لا يزال ينفذها بالترتيب الذي يتم إرفاقه في DOM.

في Internet Explorer ، يعني هذا أن البرامج النصية الخاصة بك لا يمكن أن يكون لها اعتماد على بعضها البعض لأن أمر التنفيذ سيختلف باختلاف حركة مرور الشبكة ، وذاكرة التخزين المؤقت ، إلخ.

فكر في استخدام مُحمل جافا سكريبت.سيسمح لك بتحديد تبعيات البرنامج النصي وترتيب التنفيذ مع تحميل البرامج النصية الخاصة بك بشكل غير متزامن من أجل السرعة بالإضافة إلى تسوية بعض الاختلافات في المتصفح.

وهذه نظرة عامة جيدة على عدد قليل منها: جافا سكريبت الأساسية:أعلى خمسة برامج تحميل البرامج النصية.

لقد استخدمت كلاً من RequireJS وLabJS.في رأيي، LabJS أقل رأيًا قليلاً.

Answer 3

الشرائح 25/26 من هذا العرض تحدث عن خصائص الطرق المختلفة لإدراج البرامج النصية.ويشير إلى أن IE هو المتصفح الوحيد الذي سيقوم بتنفيذ هذه البرامج النصية بالترتيب.ستقوم جميع المتصفحات الأخرى بتنفيذها بالترتيب الذي تنتهي به التحميل.حتى IE لن ينفذها بالترتيب إذا كان واحد أو أكثر يحتوي على js مضمّن بدلاً من src.

إحدى الطرق المقترحة هي إدراج عنصر DOM جديد:

var se1 = document.createElement('script');
se1.src = 'a.js';

var se2 = document.createElement('script');
se2.src = 'b.js';

var se3 = document.createElement('script');
se3.src = 'c.js';

var head = document.getElementsByTagName('head')[0]
head.appendChild(se1);
head.appendChild(se2);
head.appendChild(se3);

لإنشاء قسم البرنامج النصي الثاني، يمكنك استخدام برنامج نصي لإنشاء هذا المحتوى وتمرير المعلمات:

se2.src = 'generateScript.php?params=' + someParam;

يحرر:على الرغم مما تقوله المقالة التي قمت بتحديد موقعها، يشير الاختبار الذي أجريته إلى أن معظم المتصفحات ستنفذ البرامج النصية الخاصة بك document.write بالترتيب إذا كان كل منها يحتوي على src، لذلك بينما أعتقد أن الطريقة المذكورة أعلاه هي المفضلة، يمكنك القيام بذلك أيضًا:

<script language="javascript" type="text/javascript">
document.write("<script type='text/javascript' src='before.js'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='during.php?params=" + params + "'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='after.js'><\/sc" + "ript>");
</script>

التعديل مرة أخرى (الرد على التعليقات لنفسي وللآخرين):أنت تقوم بالفعل بإنشاء البرنامج النصي على صفحتك.يمكن نقل كل ما تفعله إلى برنامج نصي آخر من جانب الخادم والذي يقوم بإنشاء نفس كتلة التعليمات البرمجية.إذا كنت بحاجة إلى معلمات على صفحتك، فقم بتمريرها إلى البرنامج النصي في سلسلة الاستعلام.

يمكنك أيضًا استخدام نفس الطريقة إذا كنت، كما تقترح، تقوم بإنشاء البرنامج النصي المضمّن عدة مرات:

<script language="javascript" type="text/javascript">
document.write("<script type='text/javascript' src='before.js'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='during.php?params=" + params1 + "'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='during.php?params=" + params2 + "'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='during.php?params=" + params3 + "'><\/sc" + "ript>");
document.write("<script type='text/javascript' src='after.js'><\/sc" + "ript>");
</script>

ومع ذلك، فقد بدأ يبدو وكأنك تقترب من هذا بطريقة خاطئة.إذا كنت تقوم بإنشاء كتلة كبيرة من التعليمات البرمجية عدة مرات، فمن المحتمل أن تستبدلها بوظيفة js واحدة وتستدعيها بمعلمات مختلفة بدلاً من ذلك...

Answer 4

طيب...خلال...

// During.js
during[fish]();

بعد...

// After.js
alert("After");
fish++

لغة البرمجة

<!-- some html -->
<script language="javascript" type="text/javascript">
document.write("<script language='javascript' type='text/javascript' src='before.js'></sc" + "ript>");
document.write("<script language='javascript' type='text/javascript'>during[" + fish + "] = function(){alert('During!' + fish);}</sc" + "ript>");
document.write("<script language='javascript' type='text/javascript' src='during.js'></sc" + "ript>");
document.write("<script language='javascript' type='text/javascript' src='after.js'></sc" + "ript>");
</script>
<!-- some other html -->
<script language="javascript" type="text/javascript">
document.write("<script language='javascript' type='text/javascript' src='before.js'></sc" + "ript>");
document.write("<script language='javascript' type='text/javascript'>during[" + fish + "] = function(){alert('During!' + fish);}</sc" + "ript>");
document.write("<script language='javascript' type='text/javascript' src='during.js'></sc" + "ript>");
document.write("<script language='javascript' type='text/javascript' src='after.js'></sc" + "ript>");
</script>

أنا أميل إلى الاتفاق حول الطريقة التي بدأت بها هذه الرائحة.على وجه الخصوص، لماذا لا يمكنك ترميز "أثناء" في ملف js تم إنشاؤه ديناميكيًا، وإدراجه؟

لاحظ أن البرنامج النصي الذي تم إنشاؤه ديناميكيًا يذهب داخل الوظيفة في ثانية document.write.
تم اختباره في FF2، IE7

Answer 5

يمكنك فرض التنفيذ المتسلسل عن طريق تحديد أحداث "onload" (أو أحداث مشابهة) على البرامج النصية وإدخال الحدث التالي في وظيفة الحدث.ليس الأمر تافها، ولكن هناك الكثير من الأمثلة هناك، وهنا واحد.

http://www.phpied.com/javascript-include-ready-onload/

أعتقد أن المكتبات الشائعة مثل jQuery أو النموذج الأولي يمكن أن تساعد في هذا الأمر.

Answer 6

الكود المراد توفيره:

<script language="javascript" type="text/javascript">
document.write("<script language='javascript' type='text/javascript'>function callGeneratedContent() { alert('during'); }<\x2Fscript>");
document.write("<script language='javascript' type='text/javascript' src='before.js'><\x2Fscript>");
document.write("<script language='javascript' type='text/javascript' src='after.js'><\x2Fscript>");
</script>

في before.js:

alert("Before");
callGeneratedContent();

في after.js:

alert("After");

يجب عليك وضع السطر الذي تم إنشاؤه أولاً، وإلا فسوف يشكو FF لأنه يتم تنفيذه before.js قبل رؤية تعريف الوظيفة.

Answer 7

ماذا عن ذلك:

<script>
document.write("<script src='before.js'><\/script>");
</script>

<script >
document.write("<script>alert('during');<\/script>");
</script>

<script>
document.write("<script src='after.js'><\/script>");
</script>