JQuery .click for links using this keyword

As you can gather from the title, I'm using JQuery's .click function to handle someone clicking a link in my navigation bar.

When the link is clicked JQ开发者_运维问答uery loads in a specific section of a different html file into the content div of the main page. The code I've came up does what I want, but I'm a novice in JQuery, and I'm wondering how to do this without having to create a variable to hold everything.

$(document).ready(function(){
    $('#content').load('bio.html .content'); // fill #content when page loads

    $('#heading a').click(function(){ 
        var x = $(this).attr('href') + " .content"; 
        $('#content').load(x);
        return false; 
    });
});

I was trying to figure out how to do something like $('#content').load($(this.attr('href')) .content);. However, I couldn't get it to work properly, so I ended up creating the variable you see above, which is fine, but I'd like to keep things concise.

Any help or advice would be appreciated.

Is...

$('#content').load( $(this).attr('href') + " .content" );

... what you're trying to do?

You'd need to concatenate the string with the return from jQuery's method.

$('#content').load($(this).attr('href') + " .content");

Solution is fine.

Could be simplifed like this:

$('#content').load($(this).attr('href') + " .content");

However... that doesn't mean you should. You can write some very complex stuff in a single line of code, but if it isn't readable afterwards, you're just creating future problems.

I wouldn't have any issues leaving it as you had it.