js与jquery异同
2015-10-19 11:11
603 查看
大家都知道jquery是js的一个库,很多东西大多数简写了,让js写起来特别的方便。但是对与学习的人来说,最好是先学会了js再去学jquery会更好。在学得过程中你会发现两者实现的原理是差不多的,但是写法上是有很多区别的。下面是个人的一些简单的积累,来区分二者的写法。
1.起步
如果要用jquery的时候需要去引用jquery库的js。你可以下载到本地,或者是用cdn的js也可以。
2.选择器
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.遍历
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"); |
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.遍历
相关文章推荐
- 谈谈Jquery中的children find 的区别有哪些
- jquery自定义插件来实现分页的效果
- jquery中attr和prop的区别
- JQuery easyUI DataGrid 创建复杂列表头
- [转]jquery $(document).ready() 与window.onload的区别
- jquery插件layer
- jQuery EasyUI使用教程之创建一个菜单按钮
- jquery 标签中的属性操作
- jquery插件编写
- jQuery Easy-ui
- jQuery通过Ajax向PHP服务端发送请求并返回JSON数据
- jQuery实现ctrl+enter(回车)提交表单
- jquery dialog打开的时候,自动聚焦在第一个控件上
- 如何利用jQuery post传递含特殊字符的数据
- jquery左侧导航滑动网页定位效果
- jQuery.ajax( options )
- jquery中注意事项
- jquery插件:点击拉出的右侧滑动菜单
- [置顶] Jquery入门指南教程
- 如何利用jQuery post传递含特殊字符的数据【转】