Custom javascript not working

Add an external JS in the following way :

Try this,

Add your custom js in the following path.

app/design/frontend/Vendor/theme-name/web/js/nameofjs.js

then you need to add requirejs-config.js to the following path.

app/design/frontend/Vendor/theme-name/requirejs-config.js

then add the following code in it

 var config = {
    paths: {            
            'your_js_name' : 'js/nameofjs', 
        },                                                                
    shim: {
    'your_js_name': {
        deps: ['jquery']
    },
  }
};

and add the below code to load custom js, In your case it would be header.phtml in Magento_Theme folder in your theme

app/design/frontend/Vendor/theme-name/Magento_Theme/templates/html/header.phtml

<script>
require(['jquery','your_js_name'],function($) {
$(window).load(function () {
     /*alert('load from external jquery');*/
});});
</script>

Hope this helps and this is correct way to load any custom js in M2 as far as I know.

Peace :)

Instead of defined use require Like this:

require([
    'jquery',
    "jquery/ui"
], function($){
    'use strict';

    $('a[href^="#"]').on('click', function(event) {
        var target = $(this.getAttribute('href'));
        if( target.length ) {
            event.preventDefault();
            $('html, body').stop().animate({
                scrollTop: target.offset().top
            }, 1000);
        }
    });
});

In Maggento 2 the concept of requirejs is restricting you to add the an external js which is not bound into any module. So what you can do is simply create a custom module follow this & define your js there into that module at below location

Magento_root/app/code/Vendor/Module/view/frontend/web/js/file.js

It should contains the code as follows

require([
    'jquery',
    "jquery/ui"
], function($){
    'use strict';

    $('a[href^="#"]').on('click', function(event) {
        var target = $(this.getAttribute('href'));
        if( target.length ) {
            event.preventDefault();
            $('html, body').stop().animate({
                scrollTop: target.offset().top
            }, 1000);
        }
    });
});

Define it into your requirejs-config.js located at below location

Magento_root/app/code/Vendor/Module/view/frontend/requirejs-config.js

It should Contains the code as follows:

var config = {
    map: {
        '*': {
            module_js_denotation_name: 'Vendor_module/js/file',
        }
    }
};

Now you can call it into any phtml file you want to load it as follows

<script type="text/javascript">
    require(['jquery', 'module_js_denotation_name'], function($, myscript) {
        myscript();
    });
</script>

For your requirement you need to call it into the header.phtml or the footer.phtml file.

You can also create your own phtml file at Vendor/Module/view/frontend/template/template.phtml & call it there & with the help of layout Vendor/Module/view/frontend/layout/default.xaml file you can inject your template file to the theme (I am supposing that you no how to inject your phtml to your theme through the layout files).

Note: Make sure after doing this you are running the below commands o register your module & deploy the contents & make sure you are not making any changes to the default magento file always make the changes to your custome code that is inside the Magento_root/app directory

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy -f
php bin/magento cache:flush