创建一个HTML元素并保留一个引用

var newDiv = $("<div />");

newDiv.attr("id", "myNewDiv").appendTo("body");

/* Now whenever I want to append the new div I created, 
   I can just reference it from the "newDiv" variable */

检查元素是否存在

if ($("#someDiv").length)
{
    // It exists...
}

编写自己的选择器

$.extend($.expr[":"], {
    over100pixels: function (e)
    {
        return $(e).height() > 100;
    }
});

$(".box:over100pixels").click(function ()
{
    alert("The element you clicked is over 100 pixels height");
});

说到技巧和技巧，以及一些教程。我发现Jeffery Way的这些系列教程(“jQuery绝对初学者”视频系列)非常有用。

它针对那些刚接触jQuery的开发人员。他展示了如何用jQuery创建许多很酷的东西，比如动画，创建和删除元素等…

我从中学到了很多。他展示了如何简单地使用jQuery。 现在我喜欢它，我可以阅读和理解任何jQuery脚本，即使它很复杂。

这里有一个我喜欢的例子“调整文本大小”

1 - jQuery……

<script language="javascript" type="text/javascript">
    $(function() {
        $('a').click(function() {
            var originalSize = $('p').css('font-size'); // get the font size 
            var number = parseFloat(originalSize, 10); // that method will chop off any integer from the specified variable "originalSize"
            var unitOfMeasure = originalSize.slice(-2);// store the unit of measure, Pixle or Inch

            $('p').css('font-size', number / 1.2 + unitOfMeasure);
            if(this.id == 'larger'){$('p').css('font-size', number * 1.2 + unitOfMeasure);}// figure out which element is triggered
         });        
     });
</script>

2- CSS样式…

<style type="text/css" >
body{ margin-left:300px;text-align:center; width:700px; background-color:#666666;}
.box {width:500px; text-align:justify; padding:5px; font-family:verdana; font-size:11px; color:#0033FF; background-color:#FFFFCC;}
</style>

2 - HTML……

<div class="box">
    <a href="#" id="larger">Larger</a> | 
    <a href="#" id="Smaller">Smaller</a>
    <p>
    In today’s video tutorial, I’ll show you how to resize text every time an associated anchor tag is clicked. We’ll be examining the “slice”, “parseFloat”, and “CSS” Javascript/jQuery methods. 
    </p>
</div>

强烈推荐这些教程…

http://blog.themeforest.net/screencasts/jquery-for-absolute-beginners-video-series/

我喜欢在匿名函数的开头声明一个$this变量，所以我知道我可以引用一个jquery this。

像这样:

$('a').each(function() {
    var $this = $(this);

    // Other code
});

哦，不要忘了jQuery元数据!data()函数很棒，但它必须通过jQuery调用来填充。

而不是打破W3C的自定义元素属性，如:

<input 
  name="email" 
  validation="required" 
  validate="email" 
  minLength="7" 
  maxLength="30"/> 

使用元数据:

<input 
  name="email" 
  class="validation {validate: email, minLength: 2, maxLength: 50}" />

<script>
    jQuery('*[class=validation]').each(function () {
        var metadata = $(this).metadata();
        // etc.
    });
</script>

像访问数组一样访问jQuery函数

添加/删除基于布尔值的类…

function changeState(b)
{
    $("selector")[b ? "addClass" : "removeClass"]("name of the class");
}

是…的简短版本。

function changeState(b)
{
    if (b)
    {
        $("selector").addClass("name of the class");
    }
    else
    {
        $("selector").removeClass("name of the class");
    }
}

这个用例并不多。尽管如此;我认为这很整洁:)

更新

为了防止您不是注释阅读类型，ThiefMaster指出toggleClass接受一个布尔值，该值决定是否应该添加或删除一个类。因此，就我上面的示例代码而言，这将是最好的方法……

$('selector').toggleClass('name_of_the_class', true/false);

“以”结尾的元素选择器对于ASP非常有用。NET web表单开发，因为你不需要担心前面的ctl00的愚蠢:

$("[id$='txtFirstName']");

正如注释中所指出的，如果不小心使用，这个选择器(与任何抽象层一样)可能会很慢。更倾向于将选择器作用于包含元素的范围，例如:

$(".container [id$='txtFirstName']");

减少遍历所需元素的数量。

jQuery文档