jquery对象,DOM对象

  • var $cr = $('#cr');          var cr = $cr[0]; /var cr = $cr.get(0);
  • var cr = document.getElementById('cr');       var $cr = $(cr);

JQ与其他库一起使用会有冲突的时候:

  • JQ先导入:使用'jQuery()'替代'$()';其他库可以使用$();
  • JQ后导入:使用jQuery(function($){内部可以继续使用'$()'});其他库可以使用$();

 $('a'):jquery获取的是永远的对象,即使没有这个对象也不会报错;所以判断的方法为:

  • if($('a').length>0){}
  • 或转化为DOM判断:if($('a')[0]){}

 选择器

  • 基本选择器:
  • 层次选择器:$('ancestor descendant');  $('parent > child');  $('prev + next');  $(prev ~ sibiling).
    • 等价:

      • $('.one+div')  ===  $('.one').next('div');
      • $('#prve~div') === $('#prve')nextAll('div');
      • $('#prev').siblings('div')   //同辈所有的。
  • 过滤选择器    //一般情况下过滤器的内容已经为字符串无需再加引号
    • 基本过滤选择器:

      • :first,:last,   :not(selector),    :even,:odd,    :eq(index),:gt(index),:lt(index)     //index从0开始
      • :header//所有标题元素,一般冒号前无元素,
      • :animated//当前正在执行动画的所有元素,
      • :focus//当前获得焦点的元素
  • 内容过滤选择器:
    • :contains(text)
    • :empty //不包含子元素(包括空格、换行)
    • :has(selector),   :parent //含有子元素
  • 可见性过滤选择器:
    • :hidden,:visible
  • 属性过滤选择器:

    • [attr],[attr=value],[attr!=value],[attr^=value],[attr$=value]
    • [attr*=value]   //attr属性值含有value,[attr|=value]//attr属性值等于value或以value前缀(后面跟'-')
    • [attr~=value]   //value左右无其他字符串(包括开头结尾或直接等价),[attr1][attr2=value]//同时满足
  • 子过滤选择器:(这个过滤器返回的是子元素)
    • :first-child,:last-child,:only-child    //不唯一不匹配
    • :nth-child(even/odd),:nth-child(index)//index从1开始,:nth-child(2*index) //2的倍数,:nth-child(3*index+1)
  • 表单对象属性过滤选择器:
    • :enabled,:disabled //设置disable='disable',
    • :checked   //单选(radio),复选框(checkbox),
    • :selected//下拉框
  • 表单选择器
    • :input   //所有<input><textare><select><button>元素,
    • :text     //单行文本框,
    • :radio,
    • :checkbox,
    • :submit,
    • :image,
    • :reset,
    • :button,
    • :file,
    • :hidden
  • 选择器中的一些注意事项:
    • 选择器中含有特殊字符: 如#(].等注意在转义,因为在字符串内,使用双反斜杠\\
    • 注意空格

筛选:filter()//自身集合中查找,find()//子集中查找

DOM操作分类:

  • DOM Core:任何支持DOM的语言都可以使用 如:document.getElementById();elem.setAttribute();
  • HTML-DOM:使用js和dom为html编写脚本时 如:document.fomes; elem.src;
  • CSS-DOM:针对css的操作 如: elem.style.color;

属性操作:

  • 获得属性:单个attr('');多个attr('','','');
  • 设置属性:单个attr('':''); 多个attr({'':'','':''});
  • 删除属性:removeAttr();

插入节点: 名字短的方法都是将原节点放在前,新节点放在在后;

  • 成为最后一个子节点:append,appendTo;
  • 成为第一个子节点:prepend,prependTo;
  • 成为后一个节点:after,insertAfter;
  • 成为前一个节点:before,insertBefore;

删除节点:

  • remove();

删除的包括其以及其全局子元素;
返回一个该节点的引用,所以还可以继续使用,但注意其原本绑定的事件,附加的数据都会删除。
对于节点集合,还可以使用参数过滤要删除的节点;

  • detach();

效果与remove()相同,区别是会保留其原本绑定的事件和附加的数据。

  • empty();

清空元素所有的子节点,包括绑定的事件,附加的数据;
没有返回引用;
没有参数过滤;

 

jquery概要--基础01的更多相关文章

  1. jquery概要--基础02

    复制节点:clone();默认不会复制绑定事件,如果传入参数true会复制:替换节点: replaceWith()              //原节点放在前,新节点放在在后: replaceAll( ...

  2. Jquery语法基础

    Jquery语法基础 一.Jquery一般语法格式为:$(selector).action() l  美元符号定义 jQuery (又称工厂函数) l  选择器(selector)“查询”和“查找” ...

  3. [DOM Event Learning] Section 3 jQuery事件处理基础 on(), off()和one()方法使用

    [DOM Event Learning] Section 3 jQuery事件处理基础 on(),off()和one()方法使用   jQuery提供了简单的方法来向选择器(对应页面上的元素)绑定事件 ...

  4. javascript基础01

    javascript基础01 Javascript能做些什么? 给予页面灵魂,让页面可以动起来,包括动态的数据,动态的标签,动态的样式等等. 如实现到轮播图.拖拽.放大镜等,而动态的数据就好比不像没有 ...

  5. jQuery 插件基础

    jQuery 插件基础 翻译 How to Create a Basic Plugin 如果你需要在 jQuery 选择器上执行一系列重复操作, 这时候你需要编写 jQuery 插件. jQuery ...

  6. Androd核心基础01

    Androd核心基础01包含的主要内容如下 Android版本简介 Android体系结构 JVM和DVM的区别 常见adb命令操作 Android工程目录结构 点击事件的四种形式 电话拨号器Demo ...

  7. java基础学习05(面向对象基础01)

    面向对象基础01 1.理解面向对象的概念 2.掌握类与对象的概念3.掌握类的封装性4.掌握类构造方法的使用 实现的目标 1.类与对象的关系.定义.使用 2.对象的创建格式,可以创建多个对象3.对象的内 ...

  8. jquery插件开发基础入门

    jquery插件开发基础入门 入门 编写一个jquery插件开始于给jquery.fn加入新的功能属性,此处添加的对象属性的名称就是你的插件名称 jQuery.fn,myPlugin = functi ...

  9. jQuery官方基础教程笔记(转载)

    本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...

随机推荐

  1. C# 多线程通信详解

    一.WaitHandler的类层次 可以看到 WaitHandle是 事件(EventWaitHandle).互斥体(Mutex).信号量(Sempahore)的父类. WaitHandle我们最经常 ...

  2. 用WP_Query自定义WordPress 主循环

    我们知道操作 WordPress 主循环(WordPress Loop)最容易的方法是使用 query_posts 函数. 但是使用 query_posts 直接修改 WordPress 默认的主循环 ...

  3. 关于showModalDialog()对话框点击按钮弹出新页面的问题

    页面a.aspx上,单击按钮a,走脚本,弹出showModalDialog("b.aspx",....) 在b.aspx上有个服务器控件按钮b,单击按钮,更新数据后,会弹出一个新的 ...

  4. 将mysql的查询结果导出为csv

    要将mysql的查询结果导出为csv,一般会使用php连接mysql执行查询,将返回的查询结果使用php生成csv格式再导出. 但这样比较麻烦,需要服务器安装php才可以实现. 直接使用mysql导出 ...

  5. JSP基本面试的试题

    JSP基本面试的试题 1.jsp有哪些内置对象作用分别是什么 答:JSP共有以下9种基本内置组件(可与ASP的6种内部组件相对应):      request 用户端请求,此请求会包含来自GET/PO ...

  6. GraphicsMagick为图片添加水印

    GraphicsMagick号称图像处理领域的瑞士军刀.提供了健壮及高效的图像处理工具包和库,支持超过88种主流图片格式包括:BMP,GIF,JPEG,JPEG-2000,PNG,PDF,PNM,TI ...

  7. 【SpringMVC】SpringMVC系列1之HelloWorld

    SpringMVC之HelloWorld 概述 SpringMVC 是基于 MVC 设计理念的优秀Web 框架,是目前最主流的 MVC 框架之一.Spring3.0 后全面超越 Struts2,成为最 ...

  8. js 实现图片预加载 (js操作 Image对象属性complete ,事件onload 异步加载图片)

    通过js操纵DOM很多情况下都是为了实现和当前页html元素的异步载入,我谈谈对Image对象的一些认识.看个例子:<input type="button" name=&qu ...

  9. 《ASP.NET1200例》统计网站访问量源代码

    void Application_Start(object sender, EventArgs e)     {        //在应用程序启动时运行的代码        int count=0;  ...

  10. Continuous Subarray Sum

    Given an integer array, find a continuous subarray where the sum of numbers is the biggest. Your cod ...