jquery知识点总结

1、jquery 特点：
jquery是一款免费且开放源代码的javascript代码库，引入了全新的DOM选择器引擎，同时提供UI库组件。
jquery优点：
轻量级
强大的DOM选择器，简化javascript和ajax开发。
解决不同浏览器兼容问题
提供UI库组件，让页面开发更方便。

2、导入jquery:

3、Jquery事件添加，全部采用现代事件添加方式，一个事件可以绑定多个函数
$("#mydiv").click( function () {

}

4、$(function(){
……
}) 文档加载完毕后，再执行，相当于window.onload

5、jquery对象和dom对象互换。jquery对象和DOM对象方法是不一样的，使用前需要注意是什么对象
dom转为jquery
var obj = document.getElementById(“div1”);
var jq = $(obj);
jquery转为dom
var jq = $("#div1");
var obj = $(jq)[0];

6、选择器：
id选择器： var msg =$("#div1").html(); //得到id为div1的元素，标签中间的内容

子元素选择器：（相当于getElementsByTagName），找到元素指定标签子元素集合
var msg = $("#div1 label");
var msg = KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲div1").find("la…("#div1 label")[1].innerHTML); //注意取出的数组元素为DOM对象

类选择器：$("#div1 .mm").html();//得到id为div1的元素中，所有class="mm"元素集合

属性选择器： $(’#selectObj option:selected’) 选择下拉框中所有选中项

this和数组元素都是dom对象。

7、设置元素属性
$("#showImg").prop(“src”,“1.jpg”);

8、设置元素样式
$("#div1").css(
{border:‘5px solid #9f0’,backgroundColor:‘yellow’})

9、设置获得元素内容
设置、获得标签中的内容（相当于innerHMTL）
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲div1").html("<p…("#div1").html());//获得内容

设置、获得value值
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲userName").val(…("#userName").val());//获得value值

10、遍历数组
$("#div1 label").each(function (){
//得到原始DOM对象
alert(this.innerHTML);
});

11、显示、隐藏元素
$(“p”).show(“slow”);//附加动画，显示元素
$(“p”).hide(“slow”);//附加动画，隐藏元素

12、DOM操作
元素添加
$("#m1div").append("");

元素移除
//从父容器中移除id为 p1的元素
$("#p1").remove();
//从mydiv元素中移除所有样式为mm的元素
$("#mydiv").remove(".mm");

元素替换
//将所有的p元素替换为b元素
$(“p”).replaceWith("Paragraph. ");

元素下一个元素
$("#p1").next();

元素上一个元素
$("#p1").prev();

元素父元素
$("#p1").parent()