JQuery的概述
JQuery是JS的框架
JS 常用的框架:
JQuery , ExtJS , DWR , Prototype...
引入Jquery的js文件:
<script src="../../js/jquery-1.11.3.min.js"></script>
JQuery 的入口函数:
传统的JS方式页面加载只执行一次,JQuery可以执行多次,效率比window.onload高
JS对象和JQ对象的转换
window.onload = function(){
// 传统JS方式:
var d1 = document.getElementById("d1");
// JS对象的属性和方法:
// d1.innerHTML = "JS对象的属性";
// d1.html("aaaaaa");
// 将JS对象转成JQ的对象.
$(d1).html("JS对象转成JQ对象");
}
$(function(){
var ("#d1"); // $d1.html("JQ对象的属性");
// 转成JS的对象:
// 一种方式
// $d1[0].innerHTML = "将JQ的对象转成JS对象";
// 二种方式:
$d1.get(0).innerHTML = "将JQ的对象转成JS对象的方式二";
JQ 的效果操作
slideDown(); 向下滑动
slideUp(); 向上滑动
fadeIn(); 淡入
fadeOut(); 淡出
animate(); 自定义动画
\toggle(); 单击切换函数
JQ的基本选择器
id选择器
用法:$(“#id”)
类选择器
用法:$(“.类名”)
元素选择器
用法:$(“元素名称”)
通配符选择器
用法:$(“*”)
并列选择器
用法:$(“选择器,选择器,选择器”)
层级选择器
后代选择器:使用空格 所有后代包含孙子及以下的元素
子元素选择器:使用> 第一层的元素(儿子)
下一个元素:使用+ 下一个同辈元素
兄弟元素:使用~ 后面所有的同辈元素