前端jquery部分很精彩(jquery常见问题)

编辑：rootadmin

推荐整理分享前端jquery部分很精彩(jquery常见问题)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:jquery可以前后端分离吗,jquery可以前后端分离吗,jquery怎么实现前后端交互,jquery前端开发实战,jquery可以前后端分离吗,jquery前端开发实战,jquery 前端,前端jquery重不重要,内容如对您有帮助，希望把文章链接给更多的朋友！

一、简介jQuery是一个兼容多浏览器的javascript库，核心理念是write less,do more(写得更少,做得更多)。jQuery在年1月由美国人John Resig在纽约的barcamp发布，吸引了来自世界各地的众多JavaScript高手加入，由Dave Methvin率领团队进行开发。如今，jQuery已经成为最流行的javascript库，在世界前个访问最多的网站中，有超过%在使用jQuery。

二、选择器1.id选择器

2.元素标签名选择器element

3.类选择器

4.*选择器（匹配所有元素）

5.群组选择器

6.后代选择器

6.指定选择器

7.子选择器

8.next(选择器)

9.nextall(选择器)

.prev方法

.prevall方法

.slbings()方法

三、筛选器（过滤选择器）

滤器主要通过特定的过滤规则来筛选所需的 DOM 元素，和 CSS 中的伪类的语法类：使用冒号(:)开头。

1.基本筛选

：:first、:last 和 first()、last()这两组过滤器和方法在出现相同元素的时候，first 会实现第一个父元素的第一个子元素，last 会实现最后一个父元素的最后一个子元素。所以，如果需要明确是哪个父元素，需要指明：$('#box li:last').css('background', '#ccc'); //#box 元素的最后一个 li//或$('#box li).last().css('background', '#ccc'); //同上

2.内容筛选器

jQuery 提供了一个名称和:parent 相似的方法，但这个方法并不是选取含有子元素或文本的元素，而是获取当前元素的父元素，返回的是元素集合。

3.可见性过滤器

注意：:hidden 过滤器一般是包含的内容为：CSS 样式为 display:none、input 表单类型为type="hidden"和 visibility:hidden 的元素。

4.子元素过滤器

子元素过滤器的过滤规则是通过父元素和子元素的关系来获取相应的元素。

5.其他方法

四、基础DOM和css操作

1.元素内容操作

在常规的 DOM 元素中，我们可以使用 html()和 text()方法获取内部的数据。html()方法可以获取或设置 html 内容，text()可以获取或设置文本内容。

注意：当我们使用 html()或 text()设置元素里的内容时，会清空原来的数据。而我们期望能够追加数据的话，需要先获取原本的数据。$('#box').html($('#box').html() + '<em>www.li.cc</em>'); //追加数据如果元素是表单的话，jQuery 提供了 val()方法进行获取或设置内部的文本数据。

如果想设置多个选项的选定状态，比如下拉列表、单选复选框等等，可以通过数组传递操作。$("input").val(["check1","check2", "radio1" ]); //value 值是这些的将被选定

2.元素属性操作

除了对元素内容进行设置和获取，通过 jQuery 也可以对元素本身的属性进行操作，包括获取属性的属性值、设置属性的属性值，并且可以删除掉属性。

3.元素样式操作

元素样式操作包括了直接设置 CSS 样式、增加 CSS 类别、类别切换、删除类别这几种操作方法。而在整个 jQuery 使用频率上来看，CSS 样式的操作也是极高的，所以需要重点掌握。

$('div').css('color'); //获取元素行内 CSS 样式的颜色$('div').css('color', 'red'); //设置元素行内 CSS 样式颜色为红色在需要设置多个样式的时候，我们可以传递多个 CSS 样式的键值对即可。

除了行内 CSS 设置，我们也可以直接给元素添加 CSS 类，可以添加单个或多个，并且也可以删除它。

我们还可以结合事件来实现 CSS 类的样式切换功能。

4.css方法

jQuery 不但提供了 CSS 的核心操作方法，比如.css()、.addClass()等。还封装了一些特殊功能的 CSS 操作方法，我们分别来了解一下。

标签: jquery常见问题

本文链接地址:https://www.jiuchutong.com/biancheng/385787.html 转载请保留说明！