jQuery笔记（一）

1、jQuery基础语法：$(selector).action()

• 美元定义符$

示例：

• $(this).hide() - 隐藏当前元素
• $(“p”).hide() - 隐藏所有p元素
• $(“p.test”).hide() - 隐藏所有 class=”test” 的 p元素
• $(“#test”).hide() - 隐藏 id=”test” 的元素

$(document).ready(function(){
  $("p").click(function(){
    $(this).hide();
  });
});

函数声明：

$(function(){
   // 开始写 jQuery 代码...
});

2、选择器以$()符号开头

• 元素选择器：$(“p”)选取页面中所有的p元素
• #id选择器：$(“#test”)选取id为test的元素
• 类选择器：$(“.test”)选取带有class=”test”的元素

$(function(){
    $("button").click(function(){
        $("p").hide();//点击按钮隐藏p标签
    });
})

---

拓展：
1.$ (“*”)————————–选取所有元素
2.$(“p:first”)——————–选取第一个元素，last同理
3.$ (“ul li:first”)—————–选取第一个ul元素的第一个li元素
4.$ (“ul li:first-child”)——–选取每一个ul*元素的第一个li元素

<p>List 1:</p>
<ul>
  <li>Coffee</li>
  <li>Milk</li>
  <li>Tea</li>
</ul>

<p>List 2:</p>
<ul>
  <li>Coffee</li>
  <li>Milk</li>
  <li>Tea</li>
</ul>
$(function(){
  $("button").click(function(){
    $("ul li:first-child").hide();
  });
});

5.$(“[href]”)——————–选取带有href属性的元素

$(document).ready(function(){
  $("button").click(function(){
    $("[href]").hide();//隐藏含有href属性的元素
  });
});
<p><a href="http://blog.csdn.net/u012492764">Se7en's博客</a></p>
<p><a href="http://blog.csdn.net/u012492764">CSS 教程</a></p>

6.$(“a[target=’_blank’]”)——选取所有 target 属性值等于 “_blank” 的 a元素
7.$(“:button”)——————选取所有 type=”button” 的 元素 和 元素
8.$(“tr:even”) (“tr:odd”)——–选取偶数/奇数位置的 tr元素
9.nextAll选择器

• $(‘div ~p’) 选取 div之后的所有p元素