تصف هذه المقالة طريقة JavaScript لتغيير الخلفية ولون الخط في صفحة الويب. شاركه للرجوع إليه. التحليل المحدد هو كما يلي:
JavaScript ، من خلال النقر فوق الزر لتغيير لون خلفية صفحة الويب وخطها. هناك أزرار N لتغيير اللون في صفحة الويب. النقر فوق أزرار مختلفة ، سيتغير الخط وخلفية صفحة الويب إلى ألوان مختلفة. تطبيق JavaScript بسيط للغاية.
1. الأهداف الأساسية
بمجرد فتح صفحة الويب ، ستطالب أولاً برسالة الترحيب "Hello"
هناك أزرار N لتغيير اللون في صفحة الويب ، حيث يكون الإرجاع هو اللون الافتراضي لصفحة الويب ، والخلفية بيضاء ، والخط أسود.
انقر فوق أزرار مختلفة ، وسيتغير الخط وخلفية صفحة الويب إلى ألوان مختلفة.
أردت في الأصل إجراء تحسين قوس قزح ، لكن المبدأ هو نفسه تمامًا ، لذلك لن أكتب المزيد من الأزرار.
2. الأفكار الأساسية
المفتاح هو توفير معرفات لعلامات الجسم وخطوط JS بحيث يمكن التحكم فيها في JS. يوفر هذا المثال تطبيقًا على وظائف JS.
3. عملية الإنتاج
مجرد صفحة صغيرة بسيطة ، يرجى الاطلاع على التعليقات للحصول على التفاصيل:
انسخ الرمز على النحو التالي: <! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv = "content-type" content = "text /html ؛ charset = gb2312" />
<title> JS تغيير لون الخلفية </title>
<!-يمكن أيضًا فصل هذه الفقرة إلى ملف JS ، ولكن هذا الرمز قصير جدًا ، لذلك ليست هناك حاجة->
<script type = "text/javaScript">
// Onload يعادل مُنشئ صفحة الويب هذه ، و OnUnload يعادل وظيفة الانفصال عن صفحة الويب هذه
وظيفة تحميل () {
تنبيه ("مرحبا!") ؛
}
وظيفة التفريغ () {
تنبيه ("وداعا!") ؛
}
وظيفة changeColor (bcolor ، fcolor) {
// ما يعادل تغيير لون الخط للخط <span style = "color: تم تمرير fcolor">
document.getElementById ("body"). style.background = bcolor ؛
document.getElementById ("ziti"). style.color = fcolor ؛
}
</script>
</head>
<!-المفتاح هو توفير معرف لصفحة الويب وخطوط الخطوط بأكملها. يمكن أن تتحكم طريقة getElementById () في JS بسهولة في CSS->
<body onload = "load ()" onUnload = "emload ()" id = "body">
<span id = "ziti"> JS </span>
<br />
<!-لاحظ أنه عند تمرير المعلمات في عروض أسعار مزدوجة ، ستصبح عروض الأسعار المزدوجة الأصلية عروض أسعار واحدة. قيمة OnClick هي شيء سيتم تشغيله بمجرد النقر فوق هذا الزر->
<input onClick = "ChangeColor ('#ff0000' ، '#ffffff')" type = "button"
القيمة = "الأحمر" />
<input onClick = "ChangeColor ('#ff9900' ، '#ffffff')" type = "button"
القيمة = "Orange" />
<input onClick = "ChangeColor ('#ffff00' ، '#000000')" type = "button"
القيمة = "الأصفر" />
...
<input onClick = "ChangeColor ('#ffffff' ، '#000000')" type = "button"
value = "return" />
</body>
</html>
تكون وظيفة OnUnload () صالحة تقريبًا تقريبًا عندما تغلق IE هذه الصفحة ، ولن يكون مربع الحوار هذا في الواجهة الأمامية ، وليس لدى Google Chrome أي تأثير. لذلك ، هذه الوظيفة لها أهمية ضئيلة.
يمكن للأصدقاء المهتمين بمهارات تشغيل ألوان JS الإشارة أيضًا إلى الأداة عبر الإنترنت:
مولد ترميز اللون RGB
أداة مطابقة ألوان الويب عبر الإنترنت
RGB COLOR BESERY COSTION TABLE_COLOR CODE TABLE
آمل أن تكون هذه المقالة مفيدة لبرمجة JavaScript للجميع.