jquery 设为收藏

基础概念

jQuery 是一个快速、小巧且功能丰富的 JavaScript 库，它简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。通过 jQuery，开发者可以更方便地操作 DOM 元素，处理用户交互，以及进行复杂的页面动态效果。

类型

jQuery 主要有以下几种类型：

核心函数：$() 或 jQuery()，用于选择 DOM 元素。
选择器：用于选择特定的 DOM 元素。
过滤器：用于进一步筛选选择的结果。
遍历方法：用于遍历 DOM 元素。
操作方法：用于修改 DOM 元素的属性、样式等。
事件方法：用于绑定和解绑事件处理程序。
动画方法：用于实现动画效果。
Ajax 方法：用于与服务器进行数据交互。

应用场景

jQuery 广泛应用于各种 Web 开发场景，包括但不限于：

页面动态效果：如轮播图、下拉菜单等。
表单验证：在客户端进行表单数据的验证。
DOM 操作：动态添加、删除或修改页面元素。
事件处理：处理用户的点击、滚动等交互行为。
Ajax 数据交互：实现页面的异步加载和更新。

示例代码：设置收藏

假设我们要通过 jQuery 实现一个按钮，点击后将当前页面设置为用户的收藏。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Set Favorite</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <button id="setFavoriteBtn">设置为收藏</button>

    <script>
        $(document).ready(function() {
            $('#setFavoriteBtn').click(function() {
                if (window.sidebar && window.sidebar.addPanel) { // Firefox
                    window.sidebar.addPanel(document.title, window.location.href, "");
                } else if (window.external && ('AddFavorite' in window.external)) { // Internet Explorer
                    window.external.AddFavorite(location.href, document.title);
                } else if (window.opera && window.print) { // Opera
                    this.title = document.title;
                    return true;
                } else { // Other browsers (Chrome, Safari)
                    alert('请按 Ctrl+D 手动添加到收藏夹。');
                }
            });
        });
    </script>
</body>
</html>