Replace the deprecated `addListener` method from the example for MediaQueryList

[gbhasha]

Noticed in this example at line#56, https://github.com/mdn/dom-examples/blob/master/mediaquerylist/index.html

The usage of deprecated addListener method can be replaced with addEventListener

[chrisdavidmills]

Looks like @decisa fixed this, thanks!

@decisa, would you also be interested in updating the documentation to match your example? Looks like we still have an addListener page too, I'm think maybe we should delete it?

[sobhanbera]

Looks like @decisa fixed this, thanks!

@decisa, would you also be interested in updating the documentation to match your example? Looks like we still have an addListener page too, I'm think maybe we should delete it?

I want to do this task, can I? What I can do for this task? Please Guide!

[chrisdavidmills]

@SobhanBera I am more than happy for you to have a go at this. I've assigned you to the task. Let me know if you want a review, andif you want me to delete pages, etc.

[sobhanbera]

@chrisdavidmills I want help to contribute.

Please provide some details on how can I write code like what to provide(output) through the code. I saw that the index.html file already contains 'addEventListener'

Thanks

[chrisdavidmills]

@SobhanBera the example has been updated; the remainder of the work I'd like you to contribute with involves updating the MDN documentation for MediaQueryList to make sure they are updated too.

So for example:

1. The code example on the main landing page for MediaQueryList looks to have been updated so it doesn't mention addListener, but what about examples and text on other pages?
2. The addListener and removeListener links and descriptions listed inside the "Methods" section of the page should probably be put under a subheading of "Obsolete methods", as we are trying to make it clear that they are not to be used.
3. The change event needs a page creating for it. Let me know if you are OK to do that, and I'll create a page for you to add the content to. You'd need to look at an existing event page, copy the structure over, and change it to be appropriate for the mql.change event.
4. Anything else you can see that you think needs updating?

[sobhanbera]

@chrisdavidmills I am ok with this info? please create a page I would start working.

[sobhanbera]

So, I just need to provide an example of mql.addEventListener("change", event) , according to you?

[chrisdavidmills]

@SobhanBera the steps I think you need to take to complete this work are listed in my comment above (https://github.com/mdn/dom-examples/issues/62#issuecomment-722946597). No page needs to be created — it is all work on existing pages.

[iSatVeerSingh]

This issue is fixed here. https://github.com/mdn/content/pull/19635