一、chrome浏览器F12打开调试界面，在console中输入(firefox同样可以)：
var jquery = document.createElement('script'); jquery.src = "http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js";//若调试页面是https的这里也修改为https. document.getElementsByTagName('head')[0].appendChild(jquery); jQuery.noConflict();
现在试试 $("a"),已经是jQuery了(原来chrome内置的$被覆盖掉了。而且不像有些文章说的，原来的chrome内置的$并没有变成_$)
二、jQuery定位元素小总
0 获取iframe（id或name为mainFrame）中的元素
$(window.frames["mainFrame"].document).find("#more_655").children(":first").click();
1 元素选择器
获取所有元素： $("*")
类似的，找id: $("#XX") ； 找class: $(".XX") ；找有两个class属性的元素： $(".XX.YY") ； 找元素: $("p")
2 元素属性选择器
找有href属性的： $("[href]") ;
找href属性是#的： $("[href='#']") ; 找href属性不是#的： $("[href!='#']") ;
找href属性以java开头的： $("[href^='java']") ; 找href属性以.jpg结尾的： $("[href$='.jpg']") ;
找href属性包含www的： $("[href*='www']") ;
3 元素定位（基本过滤器）选择器
第一个a元素：$("a:first")[0].href ； 最后一个p元素：$("p:last") ;
类似的, :even选择偶数 :odd选择奇数 :eq(3)选择第3个（从0开始） :gt(3)选择index大于3的 :lt(3)选择index小于3的
$("input:not(:empty)") 选择不为空的input
子元素过滤器选择器
$("ul li:nth-child(2)") 每个ul的第2个li(从1开始），类似的，:first-child :last-child
$("ul li:only-child") 若ul包含多个li,则不匹配。
4 内容过滤器选择器
$(":contains('XXX')") 包括XXX ； $(":empty") 选择空元素 ;
5 可见性过滤器选择器
$("p:hidden")选择隐藏的p元素 ；类似的$("table:visible")
6 表单选择器
$(":input")选择input元素；
$(":text")选择type=text的input元素； $(":file")选择type=file的input元素；$(":image")选择type=image的input元素；
类似的有， :password :radio :checkbox :submit :reset :button
$(":enabled")选择激活的input元素；
类似的有，:disabled禁用的，:selected选取的 :checked选中的input元素；
7 层级选择器
(直接子)子选择器： >（大于号）紧跟父子关系 如$("div > p")表示选择div下的直接层是p的节点。
（所有子）后代选择器： （空格） 包括子元素 、孙元素等
（相邻兄弟）相邻兄弟选择器 ：+（加号） 紧跟兄弟关系 如$("div + p")表示选择div同层的左右相邻的p节点。
（所有兄弟）一般兄弟选择器：~ （波浪线）任意距离兄弟关系 如$("div~p")表示选择div同层的p节点。
二、jQuery操作（改变）元素
4，操作HTML内容
操作页面元素内容是最能体现jQuery高效工作的方面之一。html()和text()方法能够获取和设置使用前面的语句所选中的元素内容，而attr()可以获取和设置单个元素的属性。下面来看一些范例
html()
这个方法能够获取元素或一组元素的HTML内容，它类似于javascript的innerHTML:
var htmlContent = $("#elem").html();
//变量htmlContent就会包含id为elem的页面元素的全部HTML(包括文本)
使用类似的语法，就可以设置元素或一组元素的HTML内容：
$("elem").html("<p>helloworld</p>");
//这样就会修改id为"elem"的页面元素的HTML内容
text()
var htmlContent = $("#elem").text();
//变量 htmlContent就会包含id为elem的页面元素内部的全部文本(不包括html)
$("elem").text("helloworld");
//这样就会修改id为elem的页面元素的文本内容
append（）
$("elem").append("<p>新的helloworld</p>");
//这样会保存在原有内容的基础上，添加新的内容
$("div").append("<p>111</p>") 会给页面上全部div元素添加一些内容
attr()
当应用于一个元素时，这个方法返回特定属性的值。如果应用于一组元素，它只返回第一个元素的值。
var title = $("#elem").attr("title");
利用这个方法还可以设置属性的值:
$("elem").attr("title","helloworld")
5，显示和隐藏元素
show()
$("div").show(); //显示全部div元素 类似于 document.getElementById("elem").style.visibility = 'visible';
另外，还可以添加一些参数来调整显示的过程。
在下面的范例里，第一个参数"fast"决定了显示元素的速度。这个参数除了可以设置为fast和slow之外，还可以设置为具体的数字（单位毫秒）。如果不设置这个参数，元素就会立即显示，没有任何动画。一般来说，"slow"对应的时间是600ms，"fast"对应的时间是200ms。
第三个参数类似于回调函数，能够在显示完成时执行一次操作。
$("elem").show(600,function(){ ..function过程 });
hide()
这个方法的用途显然与show()是相反的，用于隐藏页面元素，它也有一些和show()一样的可选参数:
$("#elem").hide("slow",function(){ ..function过程 })；
toggle()
toggle()方法会改变一个元素或一组元素的当前显示状态，也就是说把显示的元素隐藏起来，把隐藏的元素显示出来。它也具有关于变化速度和回调函数的参数。
$("elem").toggle(1000,function(){ ..function过程});
6，元素动画
$("#elem").fadeOut("slow",function(){
//在淡出之后进行一些操作 })；
$("#elem").fadeIn("slow",function(){
//在淡入之后进行一些操作
})；
$("#elem").fadeTo(3000,0.5,function(){
//在淡入或淡出之后进行一些操作
})；
$("#elem").slideDown(150,function(){
//向下滑动之后进行一些操作
})；
$("#elem").slideToggle(1000,function(){
//向上或向下滑动之后进行一些操作
})；
$("elem").animate(
{
"400px",
height:"500px",
},1500,function(){
$(this).fadeOut("slow");
}
);
7，命令链
jQuery的大多数方法都返回一个jQuery对象，它可以用于再调用其他方法，这是jQuery的另一个方便之处。比如可以像这样组合前面的范例:
$("#elem").fadeOut().fadeIn();
上面这行代码会先淡出指定的元素，然后淡入显示他们。命令链的长度没有上面限制，从而可以对同一组元素连续进行很多操作:
$("elem").text("Hello from jQuery").fadeOut().fadeIn();
参考：https://blog.csdn.net/sinat_18831033/article/details/52059899
https://www.cnblogs.com/zjfjava/p/9155153.html
https://www.csdn.net/gather_23/OtTaIg0sNDkyLWJsb2cO0O0O.html