首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

JQuery选择器和JQuery包装

(本文年代久远,请谨慎阅读)今天学习了JQuery一些基本用法,包括JQuery选择器和JQuery包装; 从现在开始,要慎重区分DOM对象和JQuery对象,两种对象方法不同,属性不同,在使用中要特别注意...而在JQUERY中则完全不同,JQUERY提供了异常强大选择器用来帮助我们获取页面上对象,并且将对象以JQUERY包装形式返回。 "$"符号在JQUERY中代表对JQUERY框架引用。...(根据元素css类选择) $("*")选择页面所有元素选择所有元素) $("#divId, element, .class")(可以将几个选择器用","分隔开然后再拼成一个选择器字符串.会同时选中这几个选择器匹配内容...[i].innerHTML = 'div' + i;//通过索引访问到元素不是JQuery对象,而是DOM对象} JQuery包装 在此介绍一些基本JQuery包装及使用 ready()方法...对象,然后用对象appendTo方法追加到testDiv这个被选元素结尾,这个被选元素即某个控件, 如一个div块或者一个文本框,效果是在此控件后显示一个下拉框; 其他一些常用操作JQUERY包装函数

3.1K20

jQuery对象

当创建新元素(或选择现有元素)时,jQuery返回集合中元素jQuery许多开发人员都认为这个集合是一个数组。.length毕竟,它有一个零索引序列DOM元素一些熟悉数组函数和一个属性。...元素具有任何JavaScript对象属性。这些属性属性.tagName和方法类似.appendChild()。这些属性是通过JavaScript与网页进行交互唯一方法。...链接不是所有jQuery对象都被创建=== 关于这种“包装”行为一个重要细节是每个包装对象是唯一。即使使用相同选择器创建对象或包含对完全相同DOM元素引用,这一点也是如此。...链接jQuery对象不是“活” 给定一个jQuery对象,其中包含页面上所有段落元素: // Selecting all elements on the page....包含在jQuery对象中元素将不会改变,除非明确修改。这意味着该集合不是“直播” - 它不会随着文档更改而自动更新。

1.1K10

01-老马jQuery教程-jQuery入口函数及选择

选择器 $("div,p,li"); 使用逗号分隔,只要符合条件之一就可。...获取所有的div、p、li元素 交集选择器标签指定式选择器) $("div.redClass"); 注意选择器1和选择器2之间没有空格,class为redClassdiv元素,注意区分后代选择器。...用法 说明 $("p[attr]") 选取所有p标签且具有attr属性节点 $("p[attr=a_value]") 选取所有p标签且具有attr属性并满足属性值为a_value节点 $("p[...attr^=a_value_head]") 选取所有p标签且attr属性属性值是以a_value_head开头 $("p[attr$=a_value_end]") 选取所有p标签且attr属性属性值是以...a_value_end结尾 $("p[attr*=a_value") 选取所有p标签且attr属性属性值中包含a_value 3.8 筛选方法 语法 用法 说明 parent() $("#first

2.5K100

01-老马jQuery教程-jQuery入口函数及选择

选择器 $("div,p,li"); 使用逗号分隔,只要符合条件之一就可。...获取所有的div、p、li元素 交集选择器标签指定式选择器) $("div.redClass"); 注意选择器1和选择器2之间没有空格,class为redClassdiv元素,注意区分后代选择器。...用法 说明 $("p[attr]") 选取所有p标签且具有attr属性节点 $("p[attr=a_value]") 选取所有p标签且具有attr属性并满足属性值为a_value节点 $("p[...attr^=a_value_head]") 选取所有p标签且attr属性属性值是以a_value_head开头 $("p[attr$=a_value_end]") 选取所有p标签且attr属性属性值是以...a_value_end结尾 $("p[attr*=a_value") 选取所有p标签且attr属性属性值中包含a_value 3.8 筛选方法 语法 用法 说明 parent() $("#first

2.4K00

一文入门jQuery

文章目录 jQuery概念 快速入门 步骤: JQuery对象和JS对象区别与转换 选择器:筛选具有相似特征元素(标签) 基本操作学习 事件绑定 入口函数 样式控制:css方法 分类 基本选择器...标签选择器(元素选择器) id选择器 类选择器 并选择器 层级选择器 后代选择器 子选择属性选择属性名称选择属性选择器 复合属性选择器 过滤选择器 首元素选择器 尾元素选择器 非元素选择器...标签选择器(元素选择器) 语法: $(“html标签名”) 获得所有匹配标签名称元素 id选择器 语法: $(“#id属性值”) 获得与指定id属性值匹配元素选择器 语法: $(“.class...属性值”) 获得与指定class属性值匹配元素选择器 语法: $(“选择器1,选择器2…”) 获取多个选择器选中所有元素 层级选择器 后代选择器 语法: $("A B ") 选择A元素内部所有...B元素选择器 语法: $(“A > B”) 选择A元素内部所有B子元素 属性选择属性名称选择器 语法: $(“A[属性名]”) 包含指定属性选择属性选择器 语法: $(“A[属性名=‘值

3.5K20

jquery 使用方法

div元素 4 $('input[name=first]')//选择name属性等于firstinput元素 也可以是jQuery特有的表达式: 1 $('a:first')//选择网页中第一个...5 $('div:gt(2)')//选择所有的div元素,除了前三个 6 $('div:animated')//选择当前处于动画状态div元素 二、改变结果 如果选中多个元素jQuery...提供过滤器,可以缩小结果: 1 $('div').has('p'); //选择包含p元素div元素 2 $('div').not('.myClass'); //选择class不等于myClass...5 $('div').eq(5); //选择第6个div元素一些时候,我们需要从结果出发,移动到附近相关元素jQuery也提供了在DOM树上移动方法: 1 $('div').next(....val() 取出或设置html内容 取出某个表单元素值 需要注意是,如果结果包含多个元素,那么赋值时候,将对其中所有元素赋值;取值时候,则是只取出第一个元素值(.text(

1.6K10

jQuery设计思想

class为myClassdiv元素   $('input[name=first]') // 选择name属性等于firstinput元素 也可以是jQuery特有的表达式:   $('...div元素 二、改变结果 jQuery设计思想之二,就是提供各种强大过滤器,对结果进行筛选,缩小选择结果。   .../选择第6个div元素 有时候,我们需要从结果出发,移动到附近相关元素jQuery也提供了在DOM树上移动方法:   $('div').next('p'); //选择div元素后面的第一个...() 取出或设置某个元素高度 .val() 取出某个表单元素值 需要注意是,如果结果包含多个元素,那么赋值时候,将对其中所有元素赋值;取值时候,则是只取出第一个元素值(.text...(e) {     alert(e.type); // "click"   }); 这个事件对象有一些很有用属性和方法: event.pageX 事件发生时,鼠标距离网页左上角水平距离

2.2K60

第50次文章:JQuery基础

JavaScript框架:本质上就是一些js文件,封装了js原生代码而已 二、快速入门 1、下载JQuery (1)目前jQuery有三个大版本 1.x:兼容ie678,使用最为广泛,官方只做BUG...体积大一些 jquery-xxx.min.js:生产版本。程序中使用,没有缩进。体积小一些。...语法:$("html标签名")获得所有匹配标签名称元素 id选择器。语法:$("#id属性值")获得与指定id属性值匹配元素选择器。...语法:$(".class属性值")获得与指定class属性值匹配元素选择器。语法:$("选择器1,选择器2...") 获取多个选择器选中所有元素 (2)层级选择器 后代选择器。...语法:$("A B ")选择A元素内部所有B元素选择器。语法:$("A > B")选择A元素内部所有B子元素 (3)属性选择属性名称选择器。

1.6K30

jquery选择

jquery用法思想 选择某个网页元素,然后对它进行某种操作 jquery选择jquery选择器可以快速地选择元素选择规则和css样式相同,使用length属性判断是否选择成功。...//选择id为为ul1元素所有li下span元素 $('input[name=first]') // 选择name属性等于firstinput元素 下面就写示例来看看,如下: ?...对选择进行过滤 $('div').has('p'); // 选择包含p元素div元素 $('div').not('.myClass'); //选择class不等于myClassdiv元素 $('div...').filter('.myClass'); //选择class等于myClassdiv元素 $('div').eq(5); //选择第6个div元素 上面演示如何使用jquery选择元素,那么下面继续来演示一下选择过滤...选择转移 $('div').prev(); //选择div元素前面紧挨同辈元素 $('div').prevAll(); //选择div元素之前所有的同辈元素 $('div').next(); //选择

1.8K20

一个小时学会jQuery

)、兼容性好 1.3、jQuery版本 jQuery 1.0 (2006年8月):该库第一个稳定版本,已经具有了对CSS选择符、事件处理和AJAX交互稳健支持。...无论选择器匹配了多个或者零个元素jQuery对象都不再是null。意味着你只能够用jQuery对象.length属性来判断选择器是否选中了元素。 获得jQuery对象示例: <!...选择器和包装 为了使设计和内容分离而把CSS引入Web技术时候,需要以某种方式从外部样式表中引用页面元素组。...开发出来方法就是通过使用选择器—基于元素属性元素在HTML文档中位置,简明地表现元素。 例如,选择器:p a 引用所有嵌套于元素之内超链接(元素)组。...将每一个选择器匹配到元素合并后一起返回 集合元素 $("div,span,p.cls")选取所有,和拥有class为cls标签一组元素 * 匹配所有元素 集合元素 $(

18.5K71

jQuery 入门指南教程

: $(this).hide() - 隐藏当前元素 $('p').hide() - 隐藏所有段落 $('p.test').hide() - 隐藏所有 class="test" 段落 $('#test'...$('input[name=first]') // 选择name属性等于firstinput元素 jQuery 特有表达式 $('a:first') // 选择页面中第一个a元素 $('tr:odd...选择所有的div元素,除了前三个 $('div:animated') // 选择当前处于动画状态div元素 dom对象和jQuery对象区别 只有jQuery对象才能使用jQuery定义方法。...jQuery提供过滤器,可以缩小结果: $('div').has('p'); // 选择包含 p 元素 div 元素 $('div').not('.myClass'); // 选择 class 不等于...'); // 将它内容改为 World jQuery 常用工具方法 除了对选中元素进行操作以外,jQuery还提供一些工具方法(utility),不必选中元素,就可以直接使用。

1.2K11

2022年11月23日——jQuery——T1(基础选择器与表单选择器)

选择器 功能 返回值 #id 根据 id 属性值选取元素 单个元素 .class 根据 class 属性值选取元素 元素集合 element 根据给定标签名选取元素 元素集合 #id 选择器选取带有指定..."); }); class选择器: .class 选择器选取带有指定 class 所有元素。 class 引用 HTML 元素 class 属性。..."); }); element选择器: element 选择器选取带有指定元素名称所有元素。...选择器 功能 返回值 first() 或 :first 获取第一个元素 单个元素 last() 或 :last 获取最后一个元素 单个元素 :not(selector) 获取除给定选择器之外所有元素...> 元素 元素集合  以上就是jQuery选择一些核心内容了,希望对大家有所帮助。

5.6K10

浅谈JavaScript

层级选择属性选择器 示例代码: $('#myId') //选择id为myId标签 $('.myClass') //选择class为myClass标签 $('li') //选择所有li标签 $(...1、选择转移介绍 选择转移就是以选择标签为参照,然后获取转移后标签 2、选择转移操作 $('#box').prev(); //表示选择id是box元素上一个同级元素 $('#box').prevAll...(); //表示选择id是box元素上面所有同级元素 $('#box').next(); //表示选择id是box元素下一个同级元素 $('#box').nextAll(); //表示选择id是box...元素下面所有同级元素 $('#box').parent(); //表示选择id是box元素元素 $('#box').children(); //表示选择id是box元素所有元素 $('#box...').siblings(); //表示选择id是box元素所有同级元素 $('#box').find('.myClass'); //表示选择id是box元素class等于myClass元素 获取和设置元素内容

3.2K30

Wijmo 更优美的jQuery UI部件:发现 Wijmo

jQuery 语法示例: $(this).hide() 隐藏当前元素。 $(“p”).hide() 隐藏所有段落。 $(“p.wow”).hide() 隐藏所有“wow”类型段落。...jQuery 属性选择器 如果你想通过属性选择元素,而不是通过DOM对象,你可以使用XPATH表达式来选择具有特定属性元素。例如: $(“[href]”) 选择具有href属性所有元素。...$(“[href=”#”]”) 选择具有href属性值等于“#”所有元素。 $(“[href!=”#”]”) 选择具有href属性不等于“#”所有元素。...jQuery CSS 选择器 如果你想改变一个DOM元素CSS属性,你可以使用CSS选择器。...jQuery 选项 jQuery 选项是作为参数传递给一个部件简单属性。每一个Wijmo 部件具有一个选项默认配置;当然,会有一些情况,你希望覆盖这些定制部件属性默认值。

2.7K90
领券