js与jquery异同
大家都知道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异同的更多相关文章
- 【前端性能】必须要掌握的原生JS实现JQuery
很多时候,我们经常听见有人说jquery有多快多快.在这个各种类库满天飞的时候,不得不说的是,能有原生JS快吗? 是的,明显原生JS要更快,因为诸如JQuery这样的库必须要兼容各种浏览器和低版本和许 ...
- 移动端用js与jquery实时监听输入框值的改动
背景: 在一次移动端H5开发中,需要监听输入框值的实时变动. onchange事件肯定抛弃,因为只能失去焦点才触发. 而keyPress在Android可以触发,iOS不可以. 又不想用Android ...
- label用js,jquery取值赋值,以及怎么在后台取值
label标签在JS和Jquery中使用不能像其他标签一样用value获取它的值: 可以这样: JS: var label=document.getElementByIdx_x("id&qu ...
- JS与Jquery区别
很多人对JS和JQuery很容易搞混淆,今天我们就相比学习下: 加载区别: var myfunction(){}; JS:1.window.onload=function(){} 2.<body ...
- js和jquery如何获取图片真实的宽度和高度
按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度 1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...
- JS和JQuery的总结
JS部分 一, 词法结构 区分大小 注意://单行 /*多行注释*/ 字面量(直接量literal) 12 // 数字 5.8//小数 "hello" 'hello' true ...
- js和jquery获取当前对象的子元素
开发中经常遇到需要获取ul下的il对象,个人总结了js和jquery的方法. HTML片断: <ul class="box"> <li>子元素1</l ...
- js+html+jquery 个人笔记
js+html+jquery 笔记 1.获取HTML对象 var obj = document.getElementById(elementId) 对象的值: obj.value() 2.获取jQue ...
- prototype.js 和 jQuery.js中 ajax 的使用
这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...
随机推荐
- NEFU 505 超级红与黑 (高斯消元)
题目链接 中文题,改下模板构造一下就能过了,数据有点水,不过还是需要自由变元枚举的. #include <iostream> #include <cstdio> #includ ...
- 微信支付官方.net版之坑你没商量
最近开始弄支付这块,先是支付宝手机网站支付,也是坑了我许久,不过还好,问题不大. 让我们看看微信支付有多少坑 微信商户平台,你们知道么(我前天才知道,别笑我) 登录地址:https://mch.wei ...
- September 6th 2016 Week 37th Tuesday
I only wish to face the sea, with spring flowers blossoming. 我只愿面朝大海,春暖花开. That scenery is beautiful ...
- August 24th 2016 Week 35th Wednesday
Storms make trees take deeper roots. 暴风雨能使大树的根扎得更深. If the trees already have deep roots, then the s ...
- 群内大神与你交流WEB经验 业内专家指点就职技巧
就知道你是一个有理想要抱负的人,不会满足于做一个初级的前端开发工程师.在接下来的这个阶段,我们将走上前端开发的进阶之路,将自己的能力再往上拔高一个等级.同样,薪资也会往上升一个等级!但是,如果你是一个 ...
- oracle两时间相减得到相差的时间
1.months_between(date1,date2);date1和date2相减得到相差的月份. select months_between(to_date('2015-05-11','yyyy ...
- Javascript 封装方法
基本封装方法 请看下面的例子: var Person = function(name,age){ this.name = name; this.age = age || "未填写" ...
- Mysql游标
14.6.6.1 Cursor CLOSE Syntax 14.6.6.2 Cursor DECLARE Syntax 14.6.6.3 Cursor FETCH Syntax 14.6.6.4 Cu ...
- Ruby on Rails 接口无法调试的问题
1. 客户端 ip 与服务器 ip需要在同一网段 2. 如果 rails 版本是4.2及以上需要通过 rails s -b 0.0.0.0启动 3. 跑服务的mac需要关闭防火墙
- Android界面性能调优手册
界面是 Android 应用中直接影响用户体验最关键的部分.如果代码实现得不好,界面容易发生卡顿且导致应用占用大量内存. 我司这类做 ROM 的公司更不一样,预装的应用一定要非常流畅,这样给客户或用户 ...