How to disable scripts connected to the page through @media screen?

Question

css

Hello everyone, here's the bottom line, there is an adaptive site.
The script is connected in the body

<script type='text/javascript' src='script.js'></script>

When the full version of the site is desktop, then the script is needed, when the mobile @media screen and (max-width: 480px) {}script is not needed, as it interferes.
How to remove it from the page (or comment it out there or something else) when the mobile version is displayed?
Or is it not possible to do this through the media screen at all? Is there any alternative then?

Answer 1

The simplest is to wrap the internals of your script in if ($( document ).width() > 480).
But it is more correct, of course, to load it only when it is really needed:

if ($( document ).width() > 480) {
  $.getScript( "script.js");
}