这前一节的function(i,val)i和val分别是些啥呢

https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js

<script type="text/javascript">
    //找到男装下第一类衣服中的第一个p元素，并改变颜色
    //可以通过子类选择器  p:first-child 筛选出第一个p元素
    $("#menu_con div.tag dl dd > p:first").css('color','#9932CC');
</script>

<script type="text/javascript">
    //找到男装下第一类衣服把a元素从顺序1-4加上颜色
    //可以通过基本筛选器lt,选择匹配集合中所有索引值小于给定index参数的元素
    //注意了index是从0开始计算，所以选在1-4,为对应的index就是4
   $("#menu_con div.tag dl dd>a:lt(4)").css('color','red');
</script>

<script type="text/javascript">
    //找到男装所有a元素中属性名name="setColor"的元素，并设置颜色
    //这里用的属性选择器[attribute='value']选择指定属性是给定值的元素
   $("#menu_con div dl dd a[name='setColor']").css('color','blue');
</script>

<script type="text/javascript">
    //不分男女，选中第一类衣服中第9个a元素，并改变颜色
    //这里用了nth-child 选择的他们所有父元素的第n个子元素
    $("#menu div.tag dl dd a:nth-child(9)").css('color','#66CD00');
</script>

<script type="text/javascript">
    //找到女装下第一类衣服，把a元素中包含文字"更多"的节点，改变颜色
    $("#menu_female div.tag dl dd a:contains('更多')").css('color','#C71585');
</script>

1.假如需要选择页面中唯一的一个DOM元素，哪个是最快，最高效的选择器？

id是唯一的，每个id值在一个页面中只能使用一次。如果多个元素分配了相同的id，将只匹配该id选择集合的第一个DOM元素

$( "parent > child" ) 

子选择器：选择所有指定“parent”元素中指定的"child"的直接子元素。

$("ancestor descendant")

后代选择器：选择给定的祖先元素的所有后代元素, 一个元素的后代可能是该元素的一个孩子，孙子，曾孙等

$("prev + next")

相邻兄弟选择器：选择所有紧接在“prev”元素后的“next”元素

$("prev ~ siblings")

一般兄弟选择器：匹配“prev”元素之后的所有 兄弟元素。具有相同的父元素，并匹配过滤“siblings”选择器

jQuery选择器之层级选择器（还要再看-_-||）

$("div > p")不是选择所有div下的第一个p元素，而是所有div下的第一层所有的p元素（有可能是多个p）！

jQuery选择器之全选择器（*选择器）

在CSS中，经常会在第一行写下这样一段样式

* {padding: 0; margin: 0;}

通配符*意味着给所有的元素设置默认的边距。jQuery中我们也可以通过传递*选择器来选中文档页面中的元素

描述：

$( "*" )

如果要获取文档中所有的元素，通过document.getElementsByTagName()中传递"*"同样可以获取到

jQuery选择器之元素选择器

元素选择器：根据给定（html）标记名称选择所有的元素

描述：

$( "element" )

jQuery选择器之类选择器

类选择器，通过class样式类名来获取节点

描述：

$( ".class" )

类选择器，相对id选择器来说，效率相对会低一点，但是优势就是可以多选

jQuery除了选择上的简单，而且没有再次使用循环处理

id选择器：一个用来查找的ID，即元素的id属性

$( "#id" )

DOM对象转化成jQuery对象

如果传递给$(DOM)函数的参数是一个DOM对象，jQuery方法会把这个DOM对象给包装成一个新的jQuery对象

用：https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js

jQuery对象转化成DOM对象

jQuery是一个类数组对象，而DOM对象就是一个单独的DOM元素。

利用数组下标的方式读取到jQuery中的DOM对象

HTML代码

<div>元素一</div>
<div>元素二</div>
<div>元素三</div>

JavaScript代码

var $div = $('div') //jQuery对象
var div = $div[0] //转化成DOM对象
div.style.color = 'red' //操作dom对象的属性

用jQuery找到所有的div元素（3个），因为jQuery对象也是一个数组结构，可以通过数组下标索引找到第一个div元素，通过返回的div对象，调用它的style属性修改第一个div元素的颜色。这里需要注意的一点是，数组的索引是从0开始的，也就是第一个元素下标是0

通过jQuery自带的get()方法

jQuery对象自身提供一个.get() 方法允许我们直接访问jQuery对象中相关的DOM节点：

var $div = $('div') //jQuery对象
var div = $div.get(0) //通过get方法，转化成DOM对象
div.style.color = 'red' //操作dom对象的属性

get方法就是利用的第一种方式处理的，只是包装成一个get让开发者更直接方便的使用。

1. getElementById的参数在IE8及较低的版本不区分大小写

左边用“整个div...”html替换的是html结构 ，此时的div里没有<a>了；最后一部分$(".left a:first")时寻找到的是第二个div里的<a>

show( $("#div1:visible") ); //div1的CSS display值为none，所以获取不到visible的元素，结果为0
show( $("#div2:visible") ); //div2的宽度和高度都显式设置为0 ，所以获取不到visible的元素，结果为0
show(  $("#div3:visible") ); //div3的visibility: hidden 或 opacity: 0被认为是可见的，因为他们仍然占用空间布局，结果1
show( $("#div1:hidden") ); // 该元素hidden了，获取到一个hidden元素，结果1
show($("#div2:hidden") ); // 该元素hidden了，获取到一个hidden元素，结果1
show( $("#div3:hidden")); // 该元素是visible的，获取不到hidden元素，结果0

.html虽然也是添加内容，但会覆盖以前的，最终只显示最后一次的

.append是往里添加，不进行覆盖