Validating jQuery in JSLint errors

Question

Just came across JSLint so decided to pass my JS through it but got lots of errors but not sure if they're bad. I have tried a few things I found online to get rid of them but can't seem to make the budge.

JS code

$( document ).ready(function() {
!function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0],
        p = /^http:/.test(d.location) ? 'http' : 'https';
    if (!d.getElementById(id)) {
        js = d.createElement(s);
        js.id = id;
        js.src = p + "://platform.twitter.com/widgets.js";
        fjs.parentNode.insertBefore(js, fjs);
    }
}(document, "script", "twitter-wjs");
$('div.icon').click(function () {
    $('input#search').focus();
});
function search() {
    var query_value = $('input#search').val();
    $('b#search-string').html(query_value);
    if (query_value !== '') {
        $.ajax({
            type: "POST",
            url: "../_Scripts/search.php",
            data: {
                query: query_value
            },
            cache: false,
            success: function (html) {
                $("#results").html(html);
            }
        });
    }
    return false;
}
$("input#search").on("keyup", function (e) {
    clearTimeout($.data(this, 'timer'));
    var search_string = $(this).val();
    if (search_string == '') {
        $("#results").fadeOut();
        $('h4#results-text').fadeOut();
    } else {
        $("#results").fadeIn();
        $('h4#results-text').fadeIn();
        $(this).data('timer', setTimeout(search, 100));
    };
});
$('#pmForm').on('submit', function (e) {
    e.preventDefault();
    $('input[type=submit]', this).attr('disabled', 'disabled');
    var pmSubject = $("#pmSubject", this).val();
    var pmTextArea = $("#pmTextArea", this).val();
    var url = "../_Scripts/private_msg_parse.php";
    if (!pmSubject) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type a subject.').show().fadeOut(6000);
        return false;
    } else if (!pmTextArea) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type in your message.').show().fadeOut(6000);
        return false;
    } else {
        $("#pmFormProcessGif").show();
        $.post(url, $('#pmForm').serialize(), function (data) {
            $("#jqueryReply").html(data).show().fadeOut(10000);
            $("#pmTextArea").val('');
            $("#pmSubject").val('');
            $('input[type=submit]', this).removeAttr('disabled');
            $("#pmFormProcessGif").hide();
        });
    }
});

$('#newblog').on('submit', function (e) {
    e.preventDefault();
    $('input[type=submit]', this).attr('disabled', 'disabled');
    var blogTitle = $("#blogtitle").val();
    var blogText = CKEDITOR.instances['blogbody'].getData();
    var url = "../_Scripts/post-blog.php";
    if (!blogTitle) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type a Title.').show().fadeOut(6000);
        return false;
    } else if (!blogText) {
        $('input[type=submit]', this).removeAttr('disabled');
        $("#jqueryReply").html('<img src="../_Images/round_error.png" alt="Error" width="31" height="30" /> &nbsp; Please type in your Blog.').show().fadeOut(6000);
        return false;
    } else {
        $("#blogFormProcessGif").show();
        for (instance in CKEDITOR.instances) {
            CKEDITOR.instances['blogbody'].updateElement();
        }
        $.post(url, $('#newblog').serialize(), function (data) {
            $("#jqueryReply").html(data).show().fadeOut(10000);
            $("#blogtitle").val('');
            CKEDITOR.instances['blogbody'].setData('');
            $("#blogFormProcessGif").hide();
            location.reload();
        });
    }
});

function _(x) {
    return document.getElementById(x);
};

function report(id, uid) {
    var url = "../_Scripts/report.php";
    $.post(url, {
        blogid: id,
        userid: uid
    }, function (data) {
        alert(data);
    });
};

function toggleElement(x) {
    var x = _(x);
    if (x.style.display == 'block') {
        x.style.display = 'none';
    } else {
        x.style.display = 'block';
    }
};

var friendRequestURL = "../_Scripts/request_as_friend.php";

function addAsFriend(a, b) {
    $("#add_friend_loader").show();
    $.post(friendRequestURL, {
        request: "requestFriendship",
        mem1: a,
        mem2: b
    }, function (data) {
        $("#jqueryReply").html(data).show().fadeOut(6000);
    });
};

function acceptFriendRequest(x) {
    $.post(friendRequestURL, {
        request: "acceptFriend",
        reqID: x
    }, function (data) {
        $("#frequestreply").html(data).show();
    });
};

function denyFriendRequest(x) {
    $.post(friendRequestURL, {
        request: "denyFriend",
        reqID: x
    }, function (data) {
        $("#frequestreply").html(data).show();
    });
};

function removeAsFriend(a, b) {
    $("#remove_friend_loader").show();
    $.post(friendRequestURL, {
        request: "removeFriendship",
        mem1: a,
        mem2: b
    }, function (data) {
        $("#jqueryReply").html(data).show().fadeOut(6000);
        location.reload();
    });
};
});
var date = new Date().getFullYear();
$('#year_' + date).children('ul').addClass('active').children('li').slideDown();
$('#' + date).children('img').attr("src", "../_Images/arrow-down.gif");
$('li:not(.recent)').click(function (e) {
    if ($(this).find('>ul').hasClass('active')) {
        $(this).children('ul').removeClass('active').children('li').slideUp();
        $(this).children('img').attr("src", "../_Images/arrow.gif");
        e.stopPropagation();
    } else {
        $(this).children('ul').addClass('active').children('li').slideDown();
        $(this).children('img').attr("src", "../_Images/arrow-down.gif");
        e.stopPropagation();
    }
});

Errors:

'$' was used before it was defined.
$( document ).ready(function() {
line 1 character 4Unexpected space between '(' and 'document'.
$( document ).ready(function() {
line 1 character 13Unexpected space between 'document' and ')'.
$( document ).ready(function() {
line 1 character 29Expected exactly one space between 'function' and '('.
$( document ).ready(function() {
line 2 character 1Missing 'use strict' statement.
!function (d, s, id) {
line 3 character 5Expected 'var' at column 9, not column 5.
    var js, fjs = d.getElementsByTagName(s)[0],
line 4 character 9Expected 'p' at column 13, not column 9.
        p = /^http:/.test(d.location) ? 'http' : 'https';
line 5 character 5Expected 'if' at column 9, not column 5.
    if (!d.getElementById(id)) {
line 6 character 9Expected 'js' at column 13, not column 9.
        js = d.createElement(s);
line 7 character 9Expected 'js' at column 13, not column 9.
        js.id = id;
line 8 character 9Expected 'js' at column 13, not column 9.
        js.src = p + "://platform.twitter.com/widgets.js";
line 9 character 9Expected 'fjs' at column 13, not column 9.
        fjs.parentNode.insertBefore(js, fjs);
line 10 character 5Expected '}' at column 9, not column 5.
    }
line 11 character 1Expected '}' at column 5, not column 1.
}(document, "script", "twitter-wjs");
line 11 character 3Wrap an immediate function invocation in parentheses to assist the reader in understanding that the expression is the result of a function, and not the function itself.
}(document, "script", "twitter-wjs");
line 12 character 1Expected '$' at column 5, not column 1.
$('div.icon').click(function () {
line 13 character 5Expected '$' at column 9, not column 5.
    $('input#search').focus();
line 14 character 1Expected '}' at column 5, not column 1.
});
line 15 character 1Expected 'function' at column 5, not column 1.
function search() {
line 16 character 5Expected 'var' at column 9, not column 5.
    var query_value = $('input#search').val();
line 16 character 23'$' was used before it was defined.
    var query_value = $('input#search').val();
line 17 character 5Expected '$' at column 9, not column 5.
    $('b#search-string').html(query_value);
line 18 character 5Expected 'if' at column 9, not column 5.
    if (query_value !== '') {
line 19 character 9Expected '$' at column 13, not column 9.
        $.ajax({
line 20 character 13Expected 'type' at column 17, not column 13.
            type: "POST",
line 21 character 13Expected 'url' at column 17, not column 13.
            url: "../_Scripts/search.php",
line 22 character 13Expected 'data' at column 17, not column 13.
            data: {
line 23 character 17Expected 'query' at column 21, not column 17.
                query: query_value
line 24 character 13Expected '}' at column 17, not column 13.
            },
line 25 character 13Expected 'cache' at column 17, not column 13.
            cache: false,
line 26 character 13Expected 'success' at column 17, not column 13.
            success: function (html) {
line 27 character 17Expected '$' at column 21, not column 17.
                $("#results").html(html);
line 28 character 13Expected '}' at column 17, not column 13.
            }
line 29 character 9Expected '}' at column 13, not column 9.
        });
line 30 character 5Expected '}' at column 9, not column 5.
    }
line 31 character 5Expected 'return' at column 9, not column 5.
    return false;
line 32 character 1Expected '}' at column 5, not column 1.
}
line 33 character 1Expected '$' at column 5, not column 1.
$("input#search").on("keyup", function (e) {
line 34 character 5Expected 'clearTimeout' at column 9, not column 5.
    clearTimeout($.data(this, 'timer'));
line 34 character 18'$' was used before it was defined.
    clearTimeout($.data(this, 'timer'));
line 35 character 5Expected 'var' at column 9, not column 5.
    var search_string = $(this).val();
line 35 character 25'$' was used before it was defined.
    var search_string = $(this).val();
line 36 character 5Expected 'if' at column 9, not column 5.
    if (search_string == '') {
line 36 character 23Expected '===' and instead saw '=='.
    if (search_string == '') {
line 37 character 9Expected '$' at column 13, not column 9.
        $("#results").fadeOut();
line 38 character 9Expected '$' at column 13, not column 9.
        $('h4#results-text').fadeOut();
line 39 character 5Expected '}' at column 9, not column 5.
    } else {
line 40 character 9Expected '$' at column 13, not column 9.
        $("#results").fadeIn();
line 41 character 9Expected '$' at column 13, not column 9.
        $('h4#results-text').fadeIn();
line 42 character 9Expected '$' at column 13, not column 9.
        $(this).data('timer', setTimeout(search, 100));
line 42 character 9Too many errors. (23% scanned).

Can anyone shed some light on these errors and tell me if they're going to affect me in the future? At the moment, the code runs fine.

Thanks

Answer 1

JSLint checks for code syntax, including whitespace, not just code errors.

Errors such as Expected '===' and instead saw '=='. are very serious because of the nature of JavaScript. In JavaScript, == means compare value whereas === means compare value and type. Here are a few examples:

1 == '1'  // Evaluates to true because it doesn't check for type
1 === '1' // Evaluates to false because it does check for type (they are 
          // different types)

It is therefore always best to use === and not ==.

The whitespace errors/warnings such as

Unexpected space between '(' and 'document'.

and

Expected '}' at column 9, not column 5.

are not as serious and will probably not cause any problems with the actual performance of your code, they will, however, help improve the readability and clarity of your code. I recommend using the JSLint formatting/whitespace rules, but if you have your own valid JavaScript code formatting style, don't worry too much about it.

JSLint is a standard, not the standard, for writing JavaSript code. That said, JSLint is a very good standard. If you don't care about whitespace, JSHint is a good alternative to JSLint. JSHint is a fork of JSLint but is not as strict in places where it doesn't matter as much, namely whitespace.

As suggested in the comments above, I recommend concentrating on learning how to write good, clean, readable JavaScript code. For the most part, if your code is well written and readable, JSLint/JSHint won't find many errors. For more information about making good JavaScript code I recommend checking out JavaScript: The Good Parts by Douglas Crockford, the inventor of JSLint.