JQuery必备基础知识（一）

jQuery

1.1 初认识

作用相当于onload事件,等dom结构渲染完毕即可执行

但又有所不同

onload 事件是等页面文档、外部的 js 文件、css文件、图片加载完毕才执行内部代码。

// 第一种 $(function () { ... // 内容 }) ; // 第二种 $(document).ready(function(){ ... // 内容 });

可以用jQuery来代替，相当于原生js中的window

用原生 JS 获取来的对象是 DOM 对象

jQuery 方法获取的元素是 jQuery 对象。

jQuery 对象是经过包装的dom对象（伪数组形式存储）

jQuery对象才能使用jQuery方法,不能混用

// DOM对象转换成jQuery对象 var box = document.getElementById('box'); // 获取DOM对象 var jQueryObject = $(box); // 把DOM对象转换为 jQuery 对象 // jQuery 对象转换为 DOM 对象两种方法： // jQuery对象[索引值] var domObject1 = $('div')[0] // jQuery对象.get(索引值) var domObject2 = $('div').get(0)

2.1 jQuery选择器

2.2 基础知识

$(this).css(“color”,”red”);//自己变色 $(this).siblings(). css(“color”,””);//兄弟除色

在jQuery内部会遍历dom对象的过程叫做隐式迭代

$('div').hide(); //页面中所有的div都会被隐藏

$(this).css('color', 'red').sibling().css('color', '');

3.1 样式操作

var strColor = $(this).css('color'); $(this).css(''color'', ''red''); //参数可以是对象形式，方便设置多组样式。属性名和属性值用冒号隔开， 属性可以不用加引号 $(this).css({ "color":"white","font-size":"20px"});

一般来说通过在style中编写样式，通过添加类的方式添加样式

// 1.添加类 $("div").addClass("current"); // 2.删除类 $("div").removeClass("current"); // 3.切换类 $("div").toggleClass("current");

在原生js中className会覆盖类名，在jQuery中指操作指定类名，不影响原先的类名

jQuery jQuery UI

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。