大家都知道jquery是js的一个库,很多东西大多数简写了,让js写起来特别的方便。但是对与学习的人来说,最好是先学会了js再去学jquery会更好。在学得过程中你会发现两者实现的原理是差不多的,但是写法上是有很多区别的。下面是个人的一些简单的积累,来区分二者的写法。

1.起步

如果要用jquery的时候需要去引用jquery库的js。你可以下载到本地,或者是用cdn的js也可以。

2.选择器

选择方式/js/jquery

js

jquery
选择id document.getElementById("id"); $("#id");
选择name document.getElementsByName("name"); $("input[name='keleyicom']")
选择类名 document.getElementsByClassName("classname"); $(".classname");
选择标签 document.getElementsByTagName("tagname"); $("tagname");

3.操作html

document.getElementById("id").innerHTML;            $("#id").html();

document.getElementById("id").innerText;            $("#id").text();

document.getElementById("id").value;            $("#id").val();

赋值的时候:$("#id").val("xxx");

4.增加和删除标签

jquery:

  • append() - 在被选元素的结尾插入内容
  • prepend() - 在被选元素的开头插入内容
  • after() - 在被选元素之后插入内容
  • before() - 在被选元素之前插入内容

js:

var para=document.createElement("p");//增加
var node=document.createTextNode("This is new.");
para.appendChild(node);

var parent=document.getElementById("div1"); //删除
var child=document.getElementById("p1");
parent.removeChild(child);

5.遍历

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. 【网络】ssl与ssh

    ssh(安全外壳协议):百度百科 ssl(安全套接字):http://kb.cnblogs.com/page/162080/ https应用了ssl协议 ssh与ssl的区别:http://blog. ...

  2. MAC系统下,删除.svn文件

    MAC系统下,.svn文件是隐藏的. 如果项目是非export导出的,那么项目中会有很多的.svn文件. 如果项目的体积非常庞大,我们如何快速的批量删除.svn文件呢?下面是操作方法: 打开终端,cd ...

  3. asp.net 上一条和下一条记录的显示

    这里我用的是input标签跳转页面的: 前台aspx页面中: <input class="btn" id="btnSetForm" type=" ...

  4. osg::NodeVisitor中计算一个节点对应的世界变换矩阵、法向量、顶点坐标

    class MyNodeVisitor:public osg::NodeVisitor { pulic: MyNodeVisitor():osg::NodeVisitor(osg::NodeVisit ...

  5. 解决sqlite3_key的问题

    报错内容显示如下: ld: warning: ignoring file /Users/rowling/Library/Developer/Xcode/DerivedData/zhinengbango ...

  6. mongodb配置文件.conf

    启动方式 ./bin/mongod -f MongoDB.conf 会看到 about to fork child process, waiting until server is ready for ...

  7. 经典.net试题

    经典.net面试题目 1. 简述 private. protected. public. internal 修饰符的访问权限. 答 . private :   私有成员, 在类的内部才可以访问. pr ...

  8. 【SSO单点系列】(1):CAS4.0 环境的搭建

    一.概述 今天开始写CAS相关的第一篇文章,这篇文章主要是关于CAS环境的搭配,提供给刚刚接触CAS的一个入门指南,并演示一个CAS的最简单的实例 二.环境要求 博主的环境如下: win8.1 64 ...

  9. 解析PHP处理换行符的问题 \r\n

    一首先说说 \r 与\n的区别回车”(Carriage Return)和“换行”(Line Feed)这两个概念的来历和区别.在计算机还没有出现之前,有一种叫做电传打字机(Teletype Model ...

  10. 关于 redis、memcache、mongoDB 的对比(转载)

    from:http://yang.u85.us/memcache_redis_mongodb.pdf 从以下几个维度,对 redis.memcache.mongoDB 做了对比.1.性能都比较高,性能 ...