jquery笔记
简介
jQuery 是一个 JavaScript 库。
jQuery 极大地简化了 JavaScript 编程。
jQuery引入
引入百度CDN:
<head> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> </head>
本地引入:
<head> <script type="text/javascript" src="jquery.js"></script> </head>
jQuery基本语法
隐藏当前的 HTML 元素。
$(this).hide()
隐藏 id="test" 的元素。
$("#test").hide()
隐藏所有 <p> 元素。
$(".test").hide()
隐藏所有 class="test" 的元素。
$(".test").hide()
文档就绪函数
$(document).ready(function(){ --- jQuery functions go here ---- }); //简写为: $(function(){ })
显示、延迟隐藏元素、动画
$("#info_user_update_succ").removeClass("alert-success").addClass("alert-danger"); $('#info_user_update_succ').html('修改成功 !'); {#$('#info_user_update_succ').slideDown(100);#} $('#info_user_update_succ').show() $('#info_user_update_succ').delay(1500).slideUp(200);
添加、删除元素的class
$(".aaa").addClass("bbb").removeClass("aaa");
$(".aaa").removeClass("aaa").addClass("bbb");
jQuery - Ajax
width() - 返回元素的宽度。 height() - 返回元素的高度。 innerWidth() 方法返回元素的宽度(包括内边距)。 innerHeight() 方法返回元素的高度(包括内边距)。 outerWidth() 方法返回元素的宽度(包括内边距和边框)。 outerHeight() 方法返回元素的高度(包括内边距和边框)。 outerWidth(true) 方法返回元素的宽度(包括内边距、边框和外边距) outerHeight(true) 方法返回元素的高度(包括内边距、边框和外边距)。 返回文档(HTML 文档)的高度 $(document).height()
返回窗口(浏览器视口)的高度 $(window).height()