یک دکمه و یک جعبه (div) بسازید که با هر کلیک روی دکمه رنگ پس‌زمینه جعبه به‌صورت تصادفی تغییر کند و رنگ جدید به‌صورت متن زیر جعبه نمایش داده شود.

3.0 بازدید آخرین ویرایش در 202 روز قبل ساعت 02:34

0.0

با استفاده از HTML و CSS یک div و یک دکمه طراحی کنید؛ سپس در JavaScript با document.querySelector یا document.getElementById به عناصر دسترسی پیدا کرده و با addEventListener('click') برای دکمه شنونده قرار دهید. برای تولید رنگ تصادفی می‌توانید از تابعی که مقادیر RGB یا هگز را با Math.random() می‌سازد استفاده کنید و مقدار حاصل را در element.style.backgroundColor قرار دهید؛ همچنین با تغییر textContent یک عنصر span یا p مقدار رنگ جدید را نمایش دهید. از CSS برای تعیین اندازه و حاشیه اولیه جعبه استفاده کنید و برای ساده‌سازی می‌توان از کلاس‌ها یا inline style استفاده کرد.

توسط پژوهشگر در 202 روز قبل ساعت 02:34
دسته بندی ها: JavaScript JavaScript for beginner
reyhaneh در 202 روز قبل ساعت 09:13

نکتهٔ مفید این است که برای تولید رنگ تصادفی می‌توانید از Math.random() استفاده کنید و رنگ را به فرمت rgb(r,g,b) یا hex بدهید و به style.backgroundColor اختصاص دهید. برای نمایش مقدار رنگ زیر جعبه، یک عنصر span یا p اضافه کنید و textContent آن را برابر با مقدار رنگ قرار دهید تا کاربر به‌روشنی ببیند. برای حفظ خوانایی، می‌توانید نسبت کنتراست بین رنگ پس‌زمینه و رنگ متن را بررسی کنید و در صورت نیاز رنگ متن را تغییر دهید. اگر می‌خواهید رنگ تکراری به‌دست نیاید، می‌توانید مجددا رنگ را تولید کنید تا با رنگ قبلی تفاوت داشته باشد.

گزارش

1 پاسخ

جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من

در حال بارگیری...
ورود به حساب کاربری