English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
يمنح JavaScript صفحات HTML ديناميكية و تفاعلية أكثر؛ يمكن من خلاله تحقيق تأثيرات صفحة الويب.
إدراج سكربت
كيفية إدراج سكربت في وثيقة HTML.
استخدام علامة <noscript>
كيفية التعامل مع متصفحات لا تدعم السكربت أو تعطيلها.
تستخدم علامة <script> لتعريف سكربت العملاء، مثل JavaScript.
يمكن لعنصر <script> أن يحتوي على تعليمات السكربت أو يمكنه إشارة إلى ملف سكربت خارجي باستخدام خاصية src.
يستخدم JavaScript غالبًا في عمليات معالجة الصور، التحقق من صحة النماذج، وتحديث المحتوى بشكليندي.
سيقوم السكربت التالي بإخراج "Hello World!" إلى المتصفح:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>دليل أساسي(oldtoolbag.com)</title> </head> <body> <script> document.write("Hello World!") </script> </body> </html>اختبار النظر في ‹/›
تقدم علامة <noscript> محتوى بديلاً عندما لا يمكن استخدام السكربت، مثل عند تعطيل السكربت في المتصفح أو عدم دعم المتصفح للسكربت العملاء.
يمكن لعلامة <noscript> أن تحتوي على جميع العناصر التي يمكن العثور عليها في عنصر <body> من صفحة HTML العادية.
سيتم عرض محتوى علامة <noscript> فقط عندما لا يدعم المتصفح السكربت أو يوقفه:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>دليل أساسي(oldtoolbag.com)</title> </head> <body> <script> document.write("Hello World!") </script> <noscript>آسف، متصفحك لا يدعم JavaScript!</noscript> <p>المتصفحات التي لا تدعم جافا سكريبت ستستخدم محتوى علامة <noscript> المحدد (نص) كبديل.</p> </body> </html>اختبار النظر في ‹/›
مثال على كود جافا سكريبت:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>دليل أساسي(oldtoolbag.com)</title> </head> <body> <p> يمكن للجافا سكريبت استخدام document.write لتبدأ مباشرة في كتابة流出 HTML: </p> <script> document.write("<h1>هذا هو عنوان H1</h1>"); document.write("<p>هذا هو فقرة P.</p>"); </script> <p> يمكنك استخدام <strong>document.write</strong> فقط في流出 HTML. إذا كنت تستخدمها بعد تحميل المستند (مثل في دالة)، ستغطي المستند بأكمله. </p> </body> </html>اختبار النظر في ‹/›
<html> <head> <meta charset="utf-8"> <title>دليل أساسي(oldtoolbag.com)</title> </head> <body> <h1>سكريبت جافا سكريبت الأولى</h1> <p id="demo"> يمكن للجافا سكريبت تفعيل الأحداث، مثل ضغط الزر.</p> <script> function test_js() { document.getElementById("demo").innerHTML="Hello JavaScript(oldtoolbag.com)!"; } </script> <button type="button" onclick="test_js()">أضغط</button> </body> </html>اختبار النظر في ‹/›
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>دليل أساسي(oldtoolbag.com)</title> </head> <body> <h1>قطعة جافا سكريبت الأولى</h1> <p id="demo"> يمكن للجافا سكريبت تغيير نمط عناصر HTML (oldtoolbag.com). </p> <script> function test_js() { x=document.getElementById("demo") // العثور على العنصر x.style.color="#ff3300"; // تغيير النمط } </script> <button type="button" onclick="test_js()">انقر هنا</button> </body> </html>اختبار النظر في ‹/›
العلامة | وصف |
<script> | يحدد السكريpt على الجهاز |
<noscript> | يحدد النص الذي لا يمكن عرضه في المتصفحات التي لا تدعم السكريpt |