[知了堂学习笔记]_ js和jquery方法区别
来源:互联网 发布:据……数据显示 编辑:程序博客网 时间:2024/06/06 02:08
2.jquery是用js语言写出来的一个框架!
一、初始化
js中 :
window.onload = function(){
}
jQuery中:
$(document).ready(function(){
});
可简写为
$(function(){
});
二、获取HTML、文本和值
js中 :
dom.innerHTML =
dom.innerText =
dom.value =
jQuery中:
$("XXX").html(); //获取HTML
$("XXX").text(); //获取text,去除html
$("XXX").val(); //获取值
三、监听事件
js中 :
dom.addEventListener("XX", function(){......});
//常用的点击事件:
dom.onclick = function(){......}
jQuery中:
$("XXX").on("XX", function(){......});
//绑定和解除绑定
$("XXX").bind("XX", function(){......}).unbind("XX", function(){......});
//只执行一次事件
$("XXX").one("XX", function(){......});
//交替动作,参数为两个动作交替进行
$("XXX").toggle(function(){......}, function(){......});
四、样式的改变
如控制显示隐藏效果
js中 :
dom.style.display = "none/block";//隐藏不占位
dom.style.visibility = "hidden/visible";//隐藏但占位
jQuery中:
$("XXX").hide();
$("XXX").show();
五、获取下拉框的值和文本
js中 :
//1:拿到select对象:
var myselect=document.getElementById("XX");
//2:拿到选中项的索引:
// selectedIndex代表的是你所选中项的index
var index=myselect.selectedIndex ;
//3:拿到选中项options的value:
myselect.options[index].value;
//4:拿到选中项options的text:
myselect.options[index].text;
//2、3综合简写
myselect.options[myselect.selectedIndex].value;
jQuery中(简易,荐):
var options=$("#XXX option:selected"); //获取选中的项
alert(options.val()); //拿到选中项的值
alert(options.text()); //拿到选中项的文本
六、获取单选框/复选框的值和文本
js中 :
//单选复选一样,循环获取,checked为true表示选中
if(obj[i].checked){
alert(obj[i].value);
}
jQuery中:
$("input:checked").val();
七、获取父、兄、子节点
js中 :
//全部父节点
dom.parentNode;
//全部子节点
dom.childNode;
//下一个兄弟节点
dom.nextSilbing;
//前一个兄弟节点
dom.parentSilbing;
//第一个子节点
dom.firstChild;
//最后一个子节点
dom.lastChild;
jQuery中:
//获得子节点(不是孙子节点,只一层)
$("XX").children(expr);
//获得使用祖先节点
$("XX").parents(expr);
//获得上一个兄弟节点
$("XX").prev(expr);
//获得之前所有兄弟节点
$("XX").prevAll(expr);
//获得下一个兄弟节点
$("XX").next(expr);
//获得下面所有兄弟节点
$("XX").nextAll(expr);
//获得所有兄弟姐妹节点
$("XX").siblings(expr);
转载自http://blog.csdn.net/itzhongzi/article/details/60886549
欢迎来到知了堂社区 http://www.zhiliaotang.com/portal.php;
- [知了堂学习笔记]_ js和jquery方法区别
- [知了堂学习笔记]_jQuery入门和jQuery的选择器
- [知了堂学习笔记] jQuery选择器
- [知了堂学习笔记] jQuery的事件
- [知了堂学习笔记] jQuery Ajax
- [知了堂学习笔记]_浅谈Java反射
- [知了堂学习笔记]_记一次BootStrap的使用
- [知了堂学习笔记]_记一次BootStrap的使用
- [知了堂学习笔记]_记一次BootStrap的使用
- [知了堂学习笔记] JQuery对DOM的操作
- 【知了堂学习笔记】利用js、ajax实现遍历行传参
- [知了堂学习笔记]_MySQL函数_字符串函数_数学函数_日期函数
- 【知了堂学习笔记】JFreeChart
- [知了堂学习笔记]_JavaScript
- [知了堂学习笔记]_牵线Eclipse和Tomcat第一篇 —— 配置Java环境变量&&安装eclipse
- [知了堂学习笔记]_牵线Eclipse和Tomcat第二篇 —— 安装Tomcat&&添加Tomcat到Eclipse
- [知了堂学习笔记]_用JS制作《飞机大作战》游戏_第2讲(四大界面之间的跳转与玩家飞机的移动)
- [知了堂学习笔记]_纯JS制作《飞机大战》游戏_第2讲(对象的实现及全局变量的定义)
- C++primer message代码
- 7、树莓派音频——jackd进阶篇
- MySql从一窍不通到入门(六)分表策略:取模/时间/哈希/区域
- 02-LoadRunner
- PyCharm 安装 scipy 方法
- [知了堂学习笔记]_ js和jquery方法区别
- Git 和 GitHub
- 03-JMeter
- MySql从一窍不通到入门(七)分区策略:HASH/RANGE/LIST/KEY
- Git客户端下载及安装
- install apache
- 探索AIDL(1) -- 初识AIDL
- 浏览器兼容问题1
- 蓝牙稍微整理