Some code snippet updates…

So, I’ve been working with some of the code snippets I’ve posted on here previously, and I’ve got a few updates for them. These are pretty basic, and are written using jQuery, but could easily be done with native JavaScript – jQuery is already in use in the web app I work on, so there’s really no additional overhead (besides the extra 1/100th of a millisecond it takes to run the jQuery stuff, which I guess could be a problem if you’re running these functions millions of times, but if that’s the case, you probably have some other more important problems that need tackling).


This function will make sure an argument you’ve passed to it is a jQuery object, or convert it if it’s not. This is super handy for checking arguments before working with it inside your function:

https://error601.wordpress.com/2014/01/28/make-sure-youve-got-a-jquery-object/

Here’s the code – this now handles cases where you might just want to pass in the ID of a particular element, in which case the proper jQuery selector syntax will be added and a jQuery DOM object will be created and saved to a variable:

function jqObj(el){
    if (!el) { return false }
    var $el = el;
    if (!$el.jquery){
        $el = $(el);
        // if there's not a matching DOM element
        // then it's PROBABLY just an id string
        if (!$el.length){
            $el = $('#'+el);
        }
    }
    return $el;
}

It works like this:

(Note: don’t be a knucklehead – if you’re calling this function, give it an argument.)

a) If the argument is already a jQuery object, copy it to the new $el var, skip the other stuff, and return it.

– or –

b) Try to make it a jQuery DOM object (line 5) then check if there are, in fact, any elements in the DOM that match, but if not…

– then –

c) It’s likely that you’ve just passed a text string that matches an ID of a DOM element on your page. Maybe this is a bold assumption, but if you don’t want the hassle of passing a jQuery DOM object (or maybe this element doesn’t exist in the DOM yet, but you need the function to handle it when it does), then just tell this function the ID value and you’ll be good to go.

– so –

d) If all went well (and you weren’t a knucklehead and forgot to pass in at least SOME kind of argument), you should have a jQuery DOM object that matches an element on the page.


The next update is to this snippet:

https://error601.wordpress.com/2014/02/12/get-the-current-scripts-path/

In using it, I ran into an issue where it couldn’t get a the script file’s path if it was in the same directory as the HTML file where it was included.

Here’s the updated code:

function getScriptDir() {
    var src, path;
    src = $('script[src]').last().attr('src');
    if (src.indexOf('/') !== -1) {
        path = src.split('/');
        path.splice(path.length - 1, 1);
        return path.join('/') + '/';
    }
    else {
        return '';
    }
}

Now you can get the path to the current JavaScript file in case you would need it. I use it to dynamically grab a CSS file that contains styles needed for the current script to function properly and append it to the <head> element, if it’s not already in the DOM before the script is loaded. I’m sure there’s a much “cooler” way to do this using regex, but I guess I’m not that cool (and this works just fine).


I’ve got a few more snippets coming soon (I won’t wait another six months this time)… Stay tuned. 🙂

Advertisements

One thought on “Some code snippet updates…

  1. Pingback: Get The Current Script’s Path (non-jQuery) | Error 601

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s