jquery 的基本语法架构
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery导入与代码架构</title>
</head>
<body>
<script src="static/js/jquery-3.4.1.js"></script>
<script>
// jQuery 和 $
console.log( $ ); // 返回一个函数
console.log( jQuery ); // 返回一个函数
console.log( $ === jQuery); // true
// jQuery中的方法分为二类
// 1. 静态方法, 直接通过 $ 调用,例如: $.ajax(), $.trim()
console.log(' admin '.length); // 11
console.log($.trim(' admin ').length); // 5
// 2. 实例方法, 定义在jQuery.prototype, 即定义在它的原型对象,需要通过它的实例调用
console.log($.prototype); // 查看定义在$原型对象上的,被所有实例所共享的方法
$('body').append($('<h2>Hello jQuery</h2>')).css('color', 'red');
// append(), css()就是定义在$.prototype上的方法, 需要通过jQuery对象的实例来方法
// 代码的基本架构: html文档准备就绪之后,就立即执行ready中的回调函数中的代码
$(document).ready(function (){
// ...
});
// 还可以进一步简化, 功能是一样的, 以后咱们就使用这种语法了
$(function () {
//...
})
</script>
</body>
</html>