تتوفر ألوان عشوائية في تنسيقين:
معاينة التأثير: http://wjf444128852.github.io/demolist/js/test/index.html
1. RGB (xxx ، xxx ، xxx)
2. #xxxxxx
يتم تنفيذ طريقتين عشوائيتين التاليتين
الفكرة: كيف تجعل X عشوائيًا
1. xxx فيه هو عدد صحيح عشوائي بين 0-255. استخدم Math.Random ()*255 للحصول على رقم عشوائي بين 0-255.
ثم Math.Floor () يحتفظ بالنقطة العشرية قبل ذلك
2. x في ذلك هو مزيج عشوائي من 6 في 0123456789ABXDEF.
هنا يمكنك استخدام صفيف أو سلسلة لمعالجتها. هنا تستخدم صفيف. ما عليك سوى خذ 6 مرات من المصفوفة والحصول على ترجمة الصفيف هو عدد صحيح عشوائي بين 0 و 16 في كل مرة.
ملاحظة (على الرغم من أن التغيير في الطريقة 2 هو #xxxx ، فإن المتصفح يتحقق من قيمة سمة لون الخلفية لعنصر DOM في هذه الحالة ، ولكن المهمة في JS تكون بتنسيق #XXX.)
الرمز كما يلي:
HTML
<Body> <viv> <p> <a href = "javaScript :؛" id = "btn-one"> randomcolor-rgb </a> </p> <ul> <li> <iv> </iv> </li> <li> <iv> </viv> </li> <li> <viv> </li> </li> </li> <li> <li> <viv> </viv> </li> <li> <liv> </viv> </li> <li> <iv> </iv> </li> <li> <iv> </viv> </li> <li> <viv> </li> </li> <li> <li> <li> <viv> </viv> </li></ul> </viv> </body>
CSS
*{box-size: border-box ؛ على غرار القائمة: لا شيء ؛ الحدود: لا شيء ؛ الحشو: 0 ؛ الهامش: 0 ؛ } p {text-align: center ؛ الهامش: 20 بكسل ؛ } pa {font-size: 20px ؛ خط الرصيف: 300 ؛ اللون: #e4393c ؛ تدمير النص: لا شيء ؛ الحشو: 6px 10px ؛ الحدود: 1 بكسل للتيار الصلب. } .bg_color ، .bg_two {width: 100px ؛ الارتفاع: 100px ؛ الحدود: 1 بكسل Solid #AA00AA ؛ } .main ، .main ul {overflow: Hidden ؛ } .main {width: 400px ؛ الهامش: 30 بكسل Auto ؛ } .main ul li {float: left ؛ }JS
<script> (function () {// 1 +math.floor () i = 0 ؛ idly length ؛ i ++) {divs [i] ["0" ، "1" ، "3" ، "4" ، "6" ، "7" ، " Math.Floor (Math.Random (16) ؛ }) () </script>ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع وآمل أن يدعم الجميع wulin.com أكثر.