复习JS和jQuery

近些时日,以前学过的东西忘了好多。今天且写一点复习一下JS和jQuery.希冀与某年某月某日,忘却的时候,能看一下自己写的博文,尚可记起一二。

现在有需求如下:有两个按钮,一个是增加按钮,一个是删除按钮。当点击增加按钮的时候,就增加一行,当点击删除按钮的时候就删除一行, 要求是从最下面的开始删起,当只剩一行的时候就不可以再删除下去了。这个就有点相当于是第一行是表头吧,比如写姓名,或者年龄什么的,这些不可删除的,而下面写的实际的一些数据就可以删除了。要求用JS和jQuery做。

那么JS的代码如下:

效果就可以做到了。

这样就可以做到点增则增点删则删,且从下往上删,当只剩一行时,也就删除不了。

当然最简单的就是jQuery,代码量最少的也是jQuery的,因为它就是一个对JS的封装。就是JS的一个函数库。

其效果也是可以做到的,姓名和年龄那一列也是删除不了的。

小结如下:

:first 选取第一个元素。$("div:first")选取第一个<div>

:last 选取最后一个元素。$("div:last")选取最后一个<div>

:not(选择器) 选取不满足“选择器”条件的元素,$("input:not(.myClass)")选取样式名不是myClass的<input>

:even、:odd,选取索引是偶数、奇数的元素:$("input:even")选取索引是奇数的<input>

:eq(索引序号)、gt(索引序号)、:lt(索引序号) 选取索引等于、大于、小于索引序号的元素,比如$("input:lt(5)")选取索引小于5的<input>

empty(); 清空某元素下的所有子节点 内部实现:while(ele.firstChild){ele.removeChild(ele.firstChild);}//不同版本可能不一样。

remove(selector) 删除当前元素,返回值为被删除的元素。还可以继续使用被删除的节点。

复习JS和jQuery的更多相关文章

  1. 【前端性能】必须要掌握的原生JS实现JQuery

    很多时候,我们经常听见有人说jquery有多快多快.在这个各种类库满天飞的时候,不得不说的是,能有原生JS快吗? 是的,明显原生JS要更快,因为诸如JQuery这样的库必须要兼容各种浏览器和低版本和许 ...

  2. 移动端用js与jquery实时监听输入框值的改动

    背景: 在一次移动端H5开发中,需要监听输入框值的实时变动. onchange事件肯定抛弃,因为只能失去焦点才触发. 而keyPress在Android可以触发,iOS不可以. 又不想用Android ...

  3. label用js,jquery取值赋值,以及怎么在后台取值

    label标签在JS和Jquery中使用不能像其他标签一样用value获取它的值: 可以这样: JS: var label=document.getElementByIdx_x("id&qu ...

  4. JS与Jquery区别

    很多人对JS和JQuery很容易搞混淆,今天我们就相比学习下: 加载区别: var myfunction(){}; JS:1.window.onload=function(){} 2.<body ...

  5. js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...

  6. JS和JQuery的总结

    JS部分 一,  词法结构 区分大小 注意://单行  /*多行注释*/ 字面量(直接量literal) 12 // 数字 5.8//小数 "hello" 'hello' true ...

  7. js和jquery获取当前对象的子元素

    开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...

  8. js+html+jquery 个人笔记

    js+html+jquery 笔记 1.获取HTML对象 var obj = document.getElementById(elementId) 对象的值: obj.value() 2.获取jQue ...

  9. prototype.js 和 jQuery.js中 ajax 的使用

    这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...

随机推荐

  1. js中关于数据类型的转换

    * 一.转化为数字*/console.log(‘123123’*1.0); /* 二.从一个值中提取另一中类型的值,并完成转化工作 */console.log(parseInt(‘1233zxhag’ ...

  2. JDBC学习笔记(一)

    public static void main(String[] args) { ResultSet rs = null; Statement stmt = null; Connection conn ...

  3. 十、Notepad++正则表达式使用

    推荐个正则表达式在线测试的工具http://ccmpp.com/Regex/ Notepad++正则表达式使用 2011-01-06 10:01:35| 分类: 文档 | 标签:正则表达式 替换 no ...

  4. 检测是否支持HTML5中的Video标签

    //检测是否支持HTML5 function checkVideo() { if (!!document.createElement('video').canPlayType) { var vidTe ...

  5. C语言知识总结(5)

    预处理指令 C语言提供的预处理指令主要有:宏定义.文件包含.条件编译 宏定义 不带参数的宏定义 1>一般形式 #define 宏名 字符串 比如#define A 10 2>作用 它的作用 ...

  6. 学习笔记:JavaScript传参方式———ECMAScript中所有函数的参数都是按值传递

    我们把命名参数(arguments)视为局部变量,在向参数传递基本类型值时,如同基本类型变量的复制一样,传递一个副本,参数在函数内部的改变不会影响外部的基本类型值.如: function add10( ...

  7. 8款超酷的HTML5 3D图片动画源码

    1.HTML5移动端图片左右切换动画 今天要给大家分享一款很不错的图片左右切换焦点图动画,并且支持移动端触摸滑动.功能上,这款HTML5图片播放器支持鼠标滑动.手机端触摸滑动以及自动播放.外观上,这款 ...

  8. Git tricks: Unstaging files

    NOTE: Following content is directly reprinted from http://andrewberls.com/blog/post/git-tricks-unsta ...

  9. 工厂方法(Factory Method)模式

    一.工厂方法(Factory Method)模式 工厂方法(FactoryMethod)模式是类的创建模式,其用意是定义一个创建产品对象的工厂接口,将实际创建工作推迟的子类中. 工厂方法模式是简单工厂 ...

  10. Hbase 0.98集群搭建的详细步骤

    准备工作 Hbase的搭建是依赖于Hadoop的,Hbase的数据文件实际上存储在HDFS文件系统中,所以我们需要先搭建hadoop环境,之前的博文中已经搭建过了(详见http://www.cnblo ...