Assessment wanted for Events 3 skill test//

MDN Learn
#1

Can I pls get my work assesed. TY

#2

Hi @brusli

The task asks you to set the background of the button-bar. Therefore we need to work with buttonBar.style.backgroundColor instead of e.target.style.backgroundColor. This should make the exercise run correctly.

There are more things you can consider to simplify the code:

  • You don’t need to add the classes as we have the color information inside the data-color attribute. These can be accessed in JS with the getAttribute() method.
  • In the nested if..else statements you are testing for the color and then adding the color. You can get rid of those statements and directly assign the attribute value to the background. Do you know what I mean?

I hope those hints help you improve your code. Please ask if you need more help. I didn’t want to just post the solution and spoil the fun :grin:

Have a nice weekend,
Michael

2 Likes
#3

Hi @mikoMK
Thank you for your feedback.
I think the exercise is now running correctly.

You don’t need to add the classes as we have the color information inside the  `data-color`  attribute. These can be accessed in JS with the [ `getAttribute()` ](https://developer.mozilla.org/en-US/docs/Web/API/Element/getAttribute) method.

I dont know how to access the value of each individual data-color attribute without first assigning a class or an id to it. If I only use element.getAttribute('attributeName') I always get red.

In the nested if..else statements you are testing for the color and then adding the color. You can get rid of those statements and directly assign the attribute value to the background. Do you know what I mean?

I dont know how to do it also.

Thank you very much for your help and support.
Cheers.

1 Like
#4

You’re welcome :slightly_smiling_face:
Yes, now it works correctly.

You can just use this single line inside your event listener:

buttonBar.style.backgroundColor = e.target.getAttribute('data-color');

We get the data-color property from the target and then, as it’s already the color name, we can directly assign it to backgroundColor.
This way we don’t need classes or if...else statements.

1 Like