jQuery基础（一）

最新推荐文章于 2023-06-11 13:49:24 发布

刁连通

最新推荐文章于 2023-06-11 13:49:24 发布

阅读量272

点赞数

本文链接：https://blog.csdn.net/dlt1993814/article/details/51503412

版权

Jquery是一个js框架，里面集合了好多js的东西，方便使用，理念就是少写多用，也希望能在多种浏览器进行兼容。做前端的师兄装了多个浏览器，就是测试兼容性的问题。

Jquery用处： HTML 元素选取、元素操作、CSS 操作、HTML 事件函数、JavaScript 特效和动画、HTML DOM 遍历和修改、AJAX等等。

简单入门例子：

[html]view plaincopy 
  
print?

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>点击我，我会消失。</p>
</body>
</html>

点击之后，文字消失。除了自己建立文件，还可以采用 CDN（Content Delivery Network，内容分发网络），简单来说就是联网使用近的服务器的资源。

jQuery 语法：

只要知道这个就知道整个框架的核心东西了。因为其他都是封装好的东西，因为w3c有很多资料，就不再重复。

JQUERY语法语法 $(selector).action() $定义jquery selector 查找html元素 action 元素操作

$ 其实是JQuery的别名，其实jQuery源文件中都是JQuery.xx。你可以把它看成是一个函数名。

var my=jQuery.noConflict()，使用自己的名称，my来代替 $ 符号。

SELECTOR

元素选择器

$(this).hide() - 隐藏当前元素

$("p").hide() - 隐藏所有段落

$(".t").hide() - 隐藏所有 class="t" 的所有元素

$("p.t").hide() 隐藏所有class=“t”的元素

$("#t").hide() - 隐藏所有 id="t" 的元素

$("p#t").hide()-隐藏所有id=“t”的元素

属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

CSS 选择器

jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。下面的例子把所有 p 元素的背景颜色更改为红色：$("p").css("background-color","red");

主要就是选择器上的选择，action的话有专门的api，找对要操控的东西，进行相应的方法操控即可。

action

这东西方便和牛逼的地方都在这里，为什么说上面那github上的四个人厉害，就是他们四个人用了js实现之后让我们方便调用，而要调用的方法就像jdk的api一样，jQuery Core API Documentation。当然jQuery方法少的多了。

像hide，fadeIn这些一看就知道意思的，再结合你听听上网看到的那些华丽的效果，结合方法名直接就可以知道这些方法有什么用。

刁连通

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery基础（一）

Jquery是一个js框架，里面集合了好多js的东西，方便使用，理念就是少写多用，也希望能在多种浏览器进行兼容。做前端的师兄装了多个浏览器，就是测试兼容性的问题。Jquery用处： HTML 元素选取、元素操作、CSS 操作、HTML 事件函数、JavaScript 特效和动画、HTML DOM 遍历和修改、AJAX等等。简单入门例子：
复制链接

扫一扫