A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

就业班day_05_JS
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”)
类选择器
用法:$(“.类名”)
元素选择器
用法:$(“元素名称”)
通配符选择器
用法:$(“*”)
并列选择器
用法:$(“选择器,选择器,选择器”)
层级选择器
后代选择器:使用空格        所有后代包含孙子及以下的元素
子元素选择器:使用>        第一层的元素(儿子)
下一个元素:使用+                下一个同辈元素
兄弟元素:使用~                后面所有的同辈元素
  • append();  在某个元素后添加内容.       

  • appendTO();          将某个元素添加到另一个元素后.

  • remove();  将某个元素移除.

  • toggle();        单击事件的切换

  • hover();        鼠标悬停的切换


0 个回复

您需要登录后才可以回帖 登录 | 加入黑马