美文网首页
jQurey 基本操作

jQurey 基本操作

作者: Adder | 来源:发表于2021-02-03 15:00 被阅读0次

1.jQuery如何获取元素

$(document) //选择整个文档对象
$('#myDiv') //选择ID为myDiv的网页元素
$('div.myClass') // 选择class为myClass的div元素
$('input[name=first]') // 选择name属性等于first的input元

$('p')  //所有的<p>元素
$(':header')  //所有的标题元素:<h1> ~ <h6>
$(':animated')  //所有的动画元素
$('p:contains(xiedaimala)') // 所有包含文本为xiedaimala的<p>元素,(区分大小写)
$(':hidden')    //获取所有的隐藏元素:width和height为0、display:none、type=hidden、
$('[href]')  //属性选择器:获取所有含有属性为href的元素
$('div + p')  //每个div相邻的下一个<p>元素
$('div ~ p')  //获取跟div同级的所有的<p>元素

2.jQuery 的链式操作是怎样的

 $('div') //找到div元素
     .find('h1') //选择其中的h1元素
   .eq(2) //选择第3个h1元素
   .html('xiedaimala'); //将它的内容改为xiedaimala

链式调用是通过return this的形式来实现的。在对象上的方法中,return this,把对象返回回来,之后就可以继续调用方法,实现链式操作。

myBox= {
    getMe:function(){
       // …
      return this; // 实现链式编程的核心this,this的关键字,表示当前对象。
   }
 }

3.jQuery 如何创建元素

.append() // 结尾插入内容
.prepend() //开头插入内容
.after() //之后插入内容
.before() // 之前插入内容

4.jQuery 如何移动元素

(1).insertAfter;把div元素移动span元素后面

$('div').insertAfter($('span'));

(2).after;把span元素加到div元素前面:

$('span').after($('div'));

5.jQuery 如何修改元素的属性

以下为常见的取值和赋值函数

$('h1').html(); 获取h1的值
$('h1').html('xiedaimala'); 对h1进行赋值

$("div").text()    获取div的内容
$("div").text('新的内容')  设置div的内容

$('a').attr('属性名A') 获取属性名A的值
$('a').attr('属性名A','新的属性值') 表示为属性名A设置新的属性值

$("div").width() 获取div的宽度
$("div").width(400) 设置div的宽度为400px

$("div").height() 获取div的高度
$("div").height(400) 设置div的高度为400px

$('input').val()  表示获取某个表单元素的值
$('input').val('value')  表示设置某个表单元素的值

相关文章

  • jQurey 基本操作

    1.jQuery如何获取元素 2.jQuery 的链式操作是怎样的 链式调用是通过return this的形式来实...

  • jQurey基本

    题目1: jQuery 能做什么? jQuery是一个快速、简洁的JavaScript框架,是继Prototype...

  • 2019-04-16JQurey词汇

    # JQurey词汇 #

  • jqurey

    jQuery 语法 基础语法是:$(selector).action() 美元符号定义 jQuery选择符(sel...

  • jqurey实现运动幻灯片!

    分享一个刚学的用jqurey实现的简易运动幻灯片 上代码! html部分: css部分: jqurey部分: 第一...

  • jqurey事件

    jQuery 事件函数 jQuery 事件处理方法是 jQuery 中的核心函数。 事件处理程序指的是当 HTML...

  • 6-170-spring-2013-Software Studi

    ruby on rails and html/css/js/jqurey client-side programi...

  • Jqurey 得到url参数 getUrlParam

    Jqurey 得到url参数 getUrlParam https://blog.csdn.net/fuyifang...

  • JAVAWEB---JQurey

    一、重点问题 jquery 选择器查出的是一个集合 docoment id 查出的为具体标签 只要用jque...

  • 栈和队列

    顺序栈的基本操作: 链栈的基本操作 顺序队的基本操作 链队的基本操作

网友评论

      本文标题:jQurey 基本操作

      本文链接:https://www.haomeiwen.com/subject/olzptltx.html