Jquery
Jquery基础学习
qwy715229258163
这个作者很懒,什么都没留下…
展开
-
3-Jquery过滤选择器
【代码】3-Jquery过滤选择器。原创 2024-03-31 20:46:24 · 331 阅读 · 0 评论 -
2-Jquery层次选择器
后代选择器选择指定元素的所有后代元素(包括直接子元素和更深层的后代元素),而子元素选择器只选择指定元素的直接子元素。)用于选择紧接在另一元素后的元素,且二者有相同的父元素。)用于选择某元素后面的所有兄弟元素,无论它们之间有多少其他元素。它可以选择多个元素。原创 2024-03-31 20:34:36 · 460 阅读 · 0 评论 -
1-Jquery基本选择器
2.假设页面上有一个元素,其class为"myButton"。编写一个jQuery代码片段,用于给这个元素添加一个点击事件,当点击时弹出警告框显示"Button clicked!原创 2024-03-28 21:55:23 · 305 阅读 · 0 评论 -
19--Jquery事件绑定
在文档加载完后,可以为文档中的元素绑定事件,我们可以使用bind()方法来对匹配元素进行事件的绑定。原始文档如下:```html<div id="panel"> <h5 class="head">什么是jQuery?</h5> <div class="content"> jQuery是继Prototype之后又一个优秀的JavaScript库,它是一个由 John Resig 创建于2006年1月的开源项目。jQuery凭借简洁的语法和跨平台原创 2021-03-24 17:33:06 · 150 阅读 · 1 评论 -
18-Jquery的html()、text()、val()方法
html()方法这个方法类似JavaScript中innerHTML属性,可以用来获取或设置元素中的HTML内容。实例1:使用html()方法获取内容<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>html()方法的获取使用</title> <script src="jquery-1.11.3.js">&原创 2021-02-20 11:40:40 · 104 阅读 · 1 评论 -
17--Jquery对样式的操作之css()
jQuery中css()方法,其实底层操作的是标签中的style属性。设置样式语法:css(样式属性,样式属性的值),可以使用方法链的形式设置多个样式属性.实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>Jquery的css()设置样式</title> <script src="jquery-1.11原创 2021-02-20 10:55:07 · 122 阅读 · 2 评论 -
16--Jquery对样式的操作之删除和切换样式
使用removeClass()删除样式实例:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>Jquery的removeClass()移除样式</title> <script src="jquery-1.11.3.js"></script> <style> .原创 2021-02-20 10:51:46 · 203 阅读 · 1 评论 -
15--Jquery对样式的操作之使用addClass()追加样式
注意:addClass()方法和attr()方法的区别:前者是在原有的样式的基础上添加样式,后者是替换掉原来的样式或设置一个样式。如果给一个元素添加了多个class属性值,那么就相当于合并了他们的样式,如果不同的class设置了相同的样式属性,则后者覆盖前者。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>Jquery对样式的原创 2021-02-20 10:47:10 · 1042 阅读 · 1 评论 -
14--Jquery对样式的操作之attr()方法
前面已经说过该方法。这里只编写一个实例:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>使用attr()给指定的元素设置属性</title> <script src="jquery-1.11.3.js"></script></head><body> <ul原创 2021-02-20 10:44:12 · 202 阅读 · 0 评论 -
13--Jquery中的DOM操作(属性节点获取和设置)
attr():获取属性值或设置属性当为该方法传递一个参数时,则为某个元素获取指定的属性当为该方法传递两个参数时,则为某个元素设置指定的属性值Jquery中有很多方法都是一个函数实现获取或设置值。比如:attr(),html(),text(),val(),height(),width(),css()等。removeAttr():删除指定元素的属性。实例1:使用attr()获取指定元素的指定的属性的值。<!DOCTYPE html><html><head .原创 2021-02-20 09:38:34 · 372 阅读 · 2 评论 -
12--Jquery中的DOM操作(替换节点)
replaceWith():将所匹配的元素都替换为指定HTML或DOM元素实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>替换节点</title> <script src="jquery-1.11.3.js"></script></head><body>.原创 2021-02-20 08:59:47 · 197 阅读 · 2 评论 -
11--Jquery中的DOM操作(克隆节点)
clone():克隆匹配的DOM元素,返回克隆后的副本,但是被克隆的新节点不具有任何行为。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>克隆节点</title> <script src="jquery-1.11.3.js"></script></head><b.原创 2021-02-20 08:57:51 · 228 阅读 · 0 评论 -
10--Jquery中的DOM操作(删除节点)
remove():从DOM中删除所匹配的元素,当某个节点使用remove()方法删除后,该节点所包含的所有后代将被同时删除。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>移除节点</title> <script src="jquery-1.11.3.js"></script><原创 2021-02-20 08:55:43 · 292 阅读 · 0 评论 -
9--Jquery中的DOM操作(插入节点)
append(content):向每个匹配的元素的内部的结尾处追加内容。实例:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>插入节点</title> <script src="jquery-1.11.3.js"></script></head><body> .原创 2021-02-19 17:18:57 · 115 阅读 · 2 评论 -
8--Jquery中的DOM操作(创建节点)
创建节点使用Jquery的工厂函数$ (): $ (html);根据传入的HTML标记字符串就会创建一个DOM对象。Jquery就会把这个DOM对象包装成一个Jquery对象。注意:动态创建的额新元素节点不会自动添加到文档中。而是需要使用其他方法将其插入到文档中。创建单个元素时,需要注意闭合标签和使用标准的xhtml格式。例如创建一个元素,可以使用$ (“”) 或者 $ (“”),但是不能使用$ (“”) 或者 $ (“”)或者$ (“p”) .创建文本节点就是在创建元素节点时直接将文本内容写出来.原创 2021-02-19 15:54:12 · 242 阅读 · 2 评论 -
7--Jquery中的DOM操作(查找节点)
查找元素节点(标签):使用Jquery中的选择器来完成。查找属性节点:查找到元素节点后,可以使用Jquery对象的attr()方法来获取该元素节点的各个属性。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>查找属性节点</title> <!--导入Jquery框架--> <scrip原创 2021-02-19 15:51:05 · 191 阅读 · 2 评论 -
6--Jquery中的选择器(基本过滤选择器)
过滤选择器主要是通过特定的过滤规则筛选出所需要DOM元素,该选择器都以“:”开头。按照不同的过滤规则:过滤选择器可以分为基本过滤、内容过滤,可见性过滤,属性过滤和表单对象属性过滤选择器。:first用法: $(”tr:first”) ; 返回值 单个元素的组成的集合说明: 匹配找到的第一个元素实例:改变第一个 div 元素的背景色为 #0000FF$(function(){ $("div:first").css("backgroundColor","#0000FF");});原创 2021-02-19 15:12:30 · 247 阅读 · 2 评论 -
5--Jquery中的选择器(层次选择器)
如果想通过DOM元素之间的层次关系来获取特定元素,例如后代元素、子元素、相邻元素、兄弟元素等,则需要使用层次选择器。后代选择器(("ancestordescendant"))返回值集合元素;在给定祖先元素下匹配所有的后代元素,这个要与子代选择器区分开。用法:("ancestor descendant ")) 返回值 集合元素;在给定祖先元素下匹配所有的后代元素,这个要与子代选择器区分开。用法:("ancestordescendant"))返回值集合元素;在给定祖先元素下匹配所有的后代元素,这个要与子代原创 2021-02-19 14:37:36 · 318 阅读 · 0 评论 -
4--Jquery中的选择器(基本选择器)
选择器是Jquery框架的根基,在Jquery中对事件的处理。遍历DOM和ajax操作都依赖选择器。Jquery选择器的有点:就是写法简洁。$(“#username”)等价于:domcument.getElementById(“username”);$(“tagName”)等价于:domcument.getElementsByTagName(“tagName”)实例演示需要的HTML<!DOCTYPE html><html><head lang="en">原创 2021-02-19 14:04:49 · 221 阅读 · 2 评论 -
3--window.onload和$(document).ready()
Jquery中的$符号$ 就是jQuery的一个简写形式,例如$ (“#username”)和jQuery(“#username”)是等价的。$.ajax()和jQuery.ajax()是等价的。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title>Jquery中的$符号</title> <!--导入Jque原创 2021-02-19 09:57:43 · 205 阅读 · 3 评论 -
2--Jquery对象与JS的DOM对象的相互转换
Jquery对象与JS的DOM对象的相互转换DOM对象转换成Jquery对象对于已经是一个DOM对象,只需要使用()把该DOM对象包装起来,就可以获得一个Jquery对象了:()把该DOM对象包装起来,就可以获得一个Jquery对象了:()把该DOM对象包装起来,就可以获得一个Jquery对象了:(DOM对象)实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8">原创 2021-02-18 16:45:26 · 128 阅读 · 0 评论 -
1--Jquery对象和JS对象
Jquery对象JQuery对象就是通过JQuery包装的DOM对象后产生的对象。JQuery对象是JQuery独有的,如果一个对象是JQuery对象,则可以使用JQuery中的方法。之前DOM对象中的属性和方法,在JQuery中是无法使用的,同样JQuery对象中的属性和方法也不能在原生态的JS中使用。实例1:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8">原创 2021-02-18 15:56:29 · 198 阅读 · 5 评论