【规范】前端编码规范——jquery规范

$("div").html("");

$('div').html('');

var h = $('#element').height();
$('#element').css('height', h - 20);

var $element = $('#element'),
    h = $element.height();
$element.css('height', h - 20);

$element = $('#element');
h = $element.height();
$element.css('height',h - 20);

var $element = $('#element'),
    h = $element.height();
$element.css('height',h - 20);

var first = $('#first'),
    second = $('#second'),
    value = $first.val();

var $first = $('#first'),
    $second = $('#second'),
    value = $first.val();

var $first = $('#first'),
    $second = $('#second'),
    value = $first.val(),
    k = 3,
    COOKIEstring = 'SOMECOOKIESPLEASE',
    i,
    j,
    myArray = {};

$first.click(function(){
    $first.css('border', '1px solid red');
    $first.css('color', 'blue');
});
$first.hover(function(){
    $first.css('border', '1px solid red');
});

$first.on('click', function(){
    $first.css('border', '1px solid red');
    $first.css('color', 'blue');
});
$first.on('hover', function(){
    $first.css('border', '1px solid red');
});

$first.click(function(){
    $first.css('border', '1px solid red');
    $first.css('color', 'blue');
});

$first.on('click', function(){
    $first.css({
        'border':'1px solid red',
        'color':'blue'
    });
});

$second.html(value);
$second.on('click', function(){
    alert('hello everybody');
});
$second.fadeIn('slow');
$second.animate({height: '120px'}, 500);

$second.html(value).on('click', function(){
    alert('hello everybody');
}).fadeIn('slow').animate({height: '120px'}, 500);

$second.html(value).on('click', function(){
    alert('hello everybody');
}).fadeIn('slow').animate({height: '120px'}, 500);

$second.html(value)
    .on('click', function() {
        alert('hello everybody');
    })
    .fadeIn('slow')
    .animate({
        height: '120px'
    }, 500);

function initVar($myVar) {
    if (!$myVar) {
        $myVar = $('#selector');
    }
}

function initVar($myVar) {
    $myVar = $myVar || $('#selector');
}

$('.container > *');

$('.container').children();

var $cOntainer= $('#container'),
    $containerLi = $('#container li'),
    $containerLiSpan = $('#container li span');

var $cOntainer= $('#container '),
    $containerLi = $container.find('li'),
    $containerLiSpan= $containerLi.find('span');

$(':button');

$('input:button');

$('div#myid');
$('div#footer a.myLink');

$('#myid');
$('#footer .myLink');

$('#outer #inner');

$('#inner');

$('#id').data(key, value);

$.data('#id', key, value);

$('#stuff').live('click', function() {
    console.log('hooray');
});

$('#stuff').on('click', function() {
    console.log('hooray');
});