jQuery 引用
你将学到如何使用油猴来使用 jQuery
警告
目前 jQuery 已经并非主流的开发工具,浏览器自身所提供的 api 足够日常开发脚本所用。
如果并非个人喜好并且为初学者,可以直接跳过本章节。
基础介绍
jQuery 是一个快速、简洁的,优秀的 JavaScript 代码库(或 JavaScript 框架)。jQuery 设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装 JavaScript 常用的功能代码,提供一种简便的 JavaScript 设计模式,优化 HTML 文档操作、事件处理、动画设计和 Ajax 交互。
核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的 css 选择器,并且可对 CSS 选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery 兼容各种主流浏览器,如 IE 6.0+、FF 1.5+、Safari 2.0+、Opera 9.0+等。对于现在的主流浏览器基本支持。
使用方式
1:自己引入 jQuery 库 ,注入 script 元素标签
2: 使用油猴脚本的@require
注入脚本
关于引用冲突问题
在油猴用户脚本中引入 jQuery 库,最好运行在沙盒环境下,简单地加一条元数据@grant unsafeWindow 即可;
如果运行在@grant none 情形下,在脚本的顶部一定要添加一条this.$ = this.jQuery = jQuery.noConflict(true);
以防止与原页面 jQuery 库冲突,导致原页面功能异常。
原资料出处 : https://blog.csdn.net/nalan_yc/article/details/84769012
这里其实核心就是一个思路
1.当为 none 的时候,原网 页存在 jQuery,再进行引入会出现两个 jQuery,发生冲突,需要对 jQuery 进行冲突处理
2.当为沙盒模式的时候,可以在沙盒中引入 jQuery
但一般开发通常行为是网页存在 jQuery 我们就用网页的 jQuery,如果不存在,再进行 jQuery 的引入
学习资料
1 官网文档
https://api.jquery.com/ 访问较慢,内容为英文
2 国内翻译
中文文档,方便搜索。
3 w3school 教程
https://www.w3school.com.cn/jquery/index.asp
简易使用
元素选取
在进行网页的操作中,最重要的一步就是定位要操作的元素,如果使用 js 自带的元素选择器,进行定位会比较麻烦,而使用 jQuery 会比较简单。 jQuery 是使用 CSS 选择器进行定位的,使用标准的 CSS 选择器即可进行元素的选取和定位。 例如 :
p = $("p");
选取所有的 p 元素。