首页
学习
活动
专区
圈层
工具
发布

jQuery基本操作

使用jQuery的第一步,往往就是将一个选择表达式,放进构造函数​jQuery()​(简写为​$​),然后得到被选中的元素。...,可以对它进行一系列操作,并且所有操作可以连接在一起,以链条的形式写出来,比如: $(‘div’).find(‘h3’).eq(2).html(‘Hello’); 分解开来,就是下面这样: $(‘div...’) //找到div元素    .find(‘h3’) //选择其中的h3元素    .eq(2) //选择第3个h3元素    .html(‘Hello’); //将它的内容改为Hello 这是...第一种方法是使用​.insertAfter()​,把div元素移动​p​元素后面: (‘div’).insertAfter((‘p’)); 第二种方法是使用​.after()​,把​p​元素加到​div​...清空元素内容(但是不删除该元素)使用​.empty()​。 创建新元素的方法非常简单,只要把新元素直接传入jQuery的构造函数就行了: (’Hello’);

48910
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jQuery设计思想

    我对它做了一个详细的笔记,试图理清jQuery的设计思想,找出学习的脉络。我的目标是全面掌握jQuery,遇到问题的时候,心里有底,基本知道使用它的哪一个功能,然后可以迅速从手册中找到具体的写法。...,并且所有操作可以连接在一起,以链条的形式写出来,比如:   $('div').find('h3').eq(2).html('Hello'); 分解开来,就是下面这样:   $('div') /.../找到div元素    .find('h3') //选择其中的h3元素    .eq(2) //选择第3个h3元素    .html('Hello'); //将它的内容改为Hello 这是jQuery...第一种方法是使用.insertAfter(),把div元素移动p元素后面:   $('div').insertAfter($('p')); 第二种方法是使用.after(),把p元素加到div元素前面...而那些操作元素的方法,是定义在构造函数的prototype对象上的方法,即jQuery.prototype.method(),所以必须生成实例(即选中元素)后使用。

    2.7K60

    50个必备的实用jQuery代码段

    $('#keks').html()) { //什么都没有找到; } // 方法二 if ($('#keks').is(":empty")) { //什么都没有找到; } 如何从一个未排序的集合中找出某个元素的索引号...(el.html().replace(/word/ig, '')); 如何在一段时间之后自动隐藏或关闭元素(支持1.4版本): //这是1.3.2中我们使用setTimeout来实现的方式 setTimeout...$(".mydiv").delay(5000).hide('blind', {}, 500); 如何把已创建的元素动态地添加到DOM中: var newDiv = $('div>div>')...如何在jQuery中克隆一个元素: var cloned = $('#somediv').clone(); 在jQuery中如何测试某个元素是否可见 if($(element).is(':visible...(); 如何使用closest来取得父元素: $('#searchBox').closest('div'); 如何使用Firebug和Firefox来记录jQuery事件日志: // 允许链式日志记录

    8K00

    最常见的 20 个 jQuery 面试问题及答案

    网页上有 5 个 div> 元素,如何使用 jQuery来选择它们?(答案)   另一个重要的 jQuery 问题是基于选择器的。...鉴于这个好处,用 jQuery ready() 函数比用 JavaScript window.onload 事件要更好些。   7. 如何找到所有 HTML select 标签的选中项?...你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href? (答案)   attr() 方法被用来提取任意一个HTML元素的一个属性的值....网页上有 5 个 div> 元素,如何使用 jQuery来选择它们?(答案)   另一个重要的 jQuery 问题是基于选择器的。...你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href? (答案)   attr() 方法被用来提取任意一个HTML元素的一个属性的值.

    15.3K30

    jquery面试题目_高并发面试题

    网页上有 5 个 div> 元素,如何使用 jQuery来选择它们?(答案) 另一个重要的 jQuery 问题是基于选择器的。...如何在点击一个按钮时使用 jQuery 隐藏一个图片? 这是一个事件处理问题。jQuery为按钮点击之类的事件提供了很好的支持。你可以通过以下代码去隐藏一个通过ID或class定位到的图片。...鉴于这个好处,用 jQuery ready() 函数比用 JavaScript window.onload 事件要更好些。 7. 如何找到所有 HTML select 标签的选中项?...你是如何将一个 HTML 元素添加到 DOM 树中的?(答案如下) 你可以用 jQuery 方法 appendTo() 将一个 HTML 元素添加到 DOM 树中。...你如何使用jQuery来提取一个HTML 标记的属性 例如. 链接的href? (答案) attr() 方法被用来提取任意一个HTML元素的一个属性的值.

    10.4K10

    继续死磕前端

    jquery long long ago ~ 人们发现了一个好用的工具,它涵盖了常用的所有功能,还提供了很多相当方便的设计(如 Ajax)。...可以使用如下的过滤条件: 1.has 包含条件: $('div').has('p'); 包含 p 元素的 div 元素 2.判等条件: $('div').eq(5); 第 5 个 div 元素 3.寻找条件...大可放心,jquery 有容错机制,即使没有找到元素,也不会出错。还为你提供了验证是否找到的方法,那便是 length 属性。...jquery 中则是使用 html() 方法获取和设置 html 内容: // 获取内容 var $htm = $('#div1').html(); // 设置 html 内容 $('#div1')....html('xxx'); jquery 中获取或者设置某个属性值时可以使用如下方法: // 取出图片的地址 var $src = $('#img1').prop('src');

    3.7K10

    Web前端学习笔记之jQuery基础

    0x4 jQuery对象 jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是 jQuery独有的。...如果一个对象是 jQuery对象,那么它就可以使用jQuery里的方法:例如$(“#i1”).html()。 $("#i1").html()的意思是:获取id值为 i1的元素的html代码。...相当于: document.getElementById("i1").innerHTML; 虽然 jQuery对象是包装 DOM对象后产生的,但是 jQuery对象无法使用 DOM对象的任何方法,同理...选择器: $(".className") 配合使用: $("div.c1") // 找到有c1 class类的div标签 所有元素选择器: $("*") 组合选择器: $("#id, .className...(a))")// 找到所有后代中不含a标签的li标签 练习: 自定义模态框,使用jQuery实现弹出和隐藏功能。

    4.1K20

    前端之jQuery

    现在公司使用较多的是3.x版本 二、jQuery对象 jQuery对象就是通过jQuery包装DOM对象后产生的对象。jQuery对象是 jQuery独有的。...如果一个对象是 jQuery对象,那么它就可以使用jQuery里的方法:例如$(“#i1”).html()。 $("#i1").html()的意思是:获取id值为 i1的元素的html代码。...相当于: document.getElementById("i1").innerHTML; 虽然 jQuery对象是包装 DOM对象后产生的,但是 jQuery对象无法使用 DOM对象的任何方法,同理...#id") 标签选择器: $("tagName") class选择器: $(".className") 配合使用: $("div.c1") // 找到有c1 class类的div标签 所有元素选择器:...id之间的标签,两头的都不算 如: $('#p1').nextUntil('#p3') jQuery.fn.init [p#p2, prevObject: jQuery.fn.init(1)] 上面的元素

    6.1K21

    JQuery最全常用方法指南

    ,如果没有找到,则返回 - 1 jQuery.unique(array) 删除数组中的所有重复元素,返回整理后的数组 1、关于页面元素的引用 通过jquery的$()引用元素包括通过id、class、...普通的dom对象一般可以通过$()转换成jquery对象。 如:$(document.getElementById("msg"))则为jquery对象,可以使用jquery的方法。...如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。...对于jquery对象只能使用jquery的方法,而dom对象只能使用dom的方法,如要获取第三个 div > 元素的内容。...如: jQuery.noConflict(); // 开始使用jQuery jQuery("div p").hide(); // 使用其他库的 $() $("content").style.display

    13.2K31

    前端面试那些坑

    HTML Doctype作用?严格模式与混杂模式如何区分?它们有何意义? HTML5 为什么只需要写 ? 行内元素有哪些?块级元素有哪些? 空(void)元素有那些?...页面导入样式时,使用link和@import有什么区别? 介绍一下你对浏览器内核的理解? 常见的浏览器内核有哪些? html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?...如何在页面上实现一个圆形的可点击区域? 实现不使用 border 画出1px高的线,在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。...如何居中div?如何居中一个浮动元素?如何让绝对定位的div居中? display有哪些值?说明他们的作用。 position的值relative和absolute定位原点是?...解释一下这2个伪元素的作用。 如何修改chrome记住密码后自动填充表单的黄色背景 ? 你对line-height是如何理解的? 设置元素浮动后,该元素的display值是多少?

    2.9K60

    jQuery的基本操作

    //任何一个有效选择器 descendant //用以匹配元素的选择器,并且它是第一个选择器的后代元素 //描述 //找到表单中所有的(input)标签 HTML代码 ...[list item 1]   :not(selector) //概述 //去除所有与给定时器匹配的元素 //在jQuery1.3中.已经支持复杂选择器了(列如:not(div a)和...描述 给所有包含P元素的div元素添加一个text类 HTML代码 div>Hellodiv> div>Hello Wycdiv> jQuery代码 $("div...代码/文本值 html([val|fn]) //概述 //取得第一个匹配元素的html内容·和个函数 不能用XML文档·但可以用于XHTML文档· //在一个HTML文档中,我们可以使用.html()方法来获取任意一个元素的内容...; 回调函数描述 使用函数来设置所有匹配元素的内容 jQuery代码 $("p").html(function(n){ return "这个p元素的 index是:" +n; })

    8.8K20

    jQuery入门前言

    jQuery就是一个由JavaScript编写的轻量库,简单的说就是封装了一些JavaScript的操作,所以使用jQuery比使用原生的JavaScript可以达到用更少的代码做更多的事的效果。...一、初识jQuery: 1、使用方法: 去官网http://jquery.com/download/下载jQuery的包,然后放到项目中存放js代码的目录下,最后在需要用jQuery的HTML中用div'); //dom对象 var $div = $(div); //jQuery对象 var $first = $div.first(); //找到第一个div元素 二、jQuery选择器: 1...哈哈 div> div> 嘻嘻 div> 五、jQuery的遍历: jQuery的遍历有很多种方式,下面来看一下都如何使用。...直到找到一个匹配的就停止查找,parents一直查找到根元素,并将匹配的元素加入集合 结果不同:.closest返回的是包含零个或一个元素的jquery对象,parents返回的是包含零个或一个或多个元素的

    3.4K30
    领券