الاسم:
السبب:
معلومات المنتج:
<رئيس التشغيل = "الخادم">
<العنوان></العنوان>
<نمط النوع = "نص/CSS">
#أحمر
{
العرض: 260 بكسل؛
الارتفاع: 200 بكسل؛
الخلفية: #FF0000؛
العرض: لا شيء؛
}
#أخضر
{
العرض: 260 بكسل؛
الارتفاع: 200 بكسل؛
الخلفية: #00FF00؛
العرض: لا شيء؛
}
#أصفر
{
العرض: 260 بكسل؛
الارتفاع: 200 بكسل؛
الخلفية: #FFFF00؛
العرض: لا شيء؛
}
#أزرق
{
العرض: 260 بكسل؛
الارتفاع: 200 بكسل؛
الخلفية: #0000FF؛
العرض: لا شيء؛
}
</نمط>
<نوع البرنامج النصي = "نص/جافا سكريبت">
نافذة.onload = وظيفة () {
var btn = document.getElementsByTagName('input');
var div = document.getElementsByTagName('div');
لـ (var i = 0; i < btn.length; i++) {
btn[i].index = i;
btn[i].onclick = function () {
لـ (var i = 0; i < btn.length; i++) {
btn[i].style.background = '';
}
التبديل (هذه القيمة) {
الحالة 'اللون': this.style.background = '#FF0000';
استراحة؛
الحالة '绿色': this.style.background = '#00FF00';
استراحة؛
الحالة 'اللون': this.style.background = '#FFFF00';
استراحة؛
الحالة 'اللون': this.style.background = '#0000FF';
استراحة؛
}
لـ (var i = 0; i < btn.length; i++) {
div[i].style.display = '';
}
div[this.index].style.display = 'block';
}
}
};
</script>
</الرأس>
<الجسم>
<نوع الإدخال = "زر" معرف = "btn1" قيمة = "红色" نمط = "لون الخلفية: #FF0000" />
<نوع الإدخال = "زر" معرف = "btn2" القيمة = "绿色" />
<نوع الإدخال = "زر" id = "btn3" القيمة = "黄色" />
<نوع الإدخال = "زر" معرف = "btn4" القيمة = "蓝色" />
<div id="red" style="display: block;">
</div>
<div معرف = "الأخضر">
</div>
<div معرف = "أصفر">
</div>
<div معرف = "أزرق">
</div>
</الجسم>