jquery测试页面

1. 引入jQuery

1. <script src="js/jquery.js"></script>: 引入本地jQuery库。
2. 注释掉的CDN引入: 可以通过注释的方式，使用CDN（内容分发网络）引入jQuery，这样可以提高加载速度并减少服务器负担。

2. 样式

1. <style>: 定义页面的内联CSS样式。
2. div { width: 200px; height: 100px; background: red; }: 为所有<div>元素设置宽度、高度和背景色。

3. jQuery脚本

1. $(function() { ... });: 文档就绪函数，确保DOM完全加载后再执行内部代码。

3.1 绑定事件的方式

1. 事件函数绑定

:

$("div").hover(function() {

    alert(1);

});

1. 1. 绑定鼠标悬停事件，触发时弹出警告框。
2. 使用

on方法绑定事件:

$("div").on("click", function() {

    alert(1);

});

1. 1. 通过on方法绑定多个事件类型（如click mouseenter）：

var aa = "click mouseenter";

$("div").on(aa, function() {

    alert(1);

});

1. 1. on方法可以用于动态绑定，允许绑定未来元素的事件。
2. 动态添加元素事件绑定

:

$("body").on("click", "h1", function() {

    alert(1);

});

1. 1. 通过事件委托，在body上绑定事件，当h1元素被点击时触发。

3.2 DOM与jDOM元素

1. DOM与jDOM的区别

:

1. 1. DOM（Document Object Model）是JavaScript操作HTML文档的原生接口。
   2. jDOM是jQuery提供的对象，允许使用jQuery的方法进行操作。
2. DOM与jDOM的转换

:

1. 1. 从DOM到jDOM: $(dom)，将原生DOM元素转换为jQuery对象。
   2. 从jDOM到DOM: jdom[0]，返回原生DOM元素。
2. 示例代码

:

$(".aa").eq(1) // 获取第二个.jj类的元素

$(".aa")[1] // 获取原生DOM元素

3.3 AJAX请求

1. $.ajax(): jQuery提供的方法用于发起异步HTTP请求。
   1. url: 请求路径。
   2. type: 请求类型（GET或POST）。
   3. data: 请求参数。
   4. success: 请求成功时的回调函数，接收服务器返回的值。
   5. error: 请求失败时的回调函数，处理错误情况。