@MRsunhuimin
2019-08-18T10:44:22.000000Z
字数 2026
阅读 189
web
- js是一种脚本语言,常用于网页客户端编程,使网页在客户端浏览器中,实现更多地动态功能,表现出更加丰富的视觉效果。
- jquery是一个快速、简洁的JavaScript框架,极大的简化了javascript编程。
- 先复制jquery,引入js包中
- 然后再写
<script src="js/jquery-1.12.4.js"type="text/jscript"></script>- 最后还要写
<script>代码<script>
$(选择器).val(); //获取
$(选择器).val(值); //赋值
- .html();//获取
- .html("XXXX");//赋值
- .text();//获取
- .text(w);文本内容); //赋值
操作单个CSS
$(选择器).css(属性,值); //改变
$(选择器).css(属性); //获取
操作多个CSS
- $(选择器).css({属性1:值1,属性2:值2}); //改变
- js转jquery:$(js对象);
- jquery转js:(选择器).get(0)或(选择器)[0]
//addClass 添加class样式
$(".div1").addClass("div1");//removeClass 删除class样式
$(".div1").removeClass("div1");
- (选择器).attr(HTML属性,值); //改变属性值
- 隐藏:hide(显示时间<毫秒>,函数)显示元素
- 显示:show(显示时间<毫秒>,函数)显示元素
- 切换:toggle(显示时间<毫秒>,函数) 隐藏与显示
- 遍历
$(选择器).each(function(下标,值){//代码块});$.each(数组名,function(下标,值){//代码块});
$(选择器).submit(function(){return true; //true提交 false禁止提交});
$(选择器).click(function(){});
$(window).keydown(function(k){k.keyCode //获取键盘按下后对于的键值});
$(选择器).focus(function(){});
$(选择器).blur(function(){});
$(选择器).change(function(){});
$("body").on(要绑定的事件,目标元素,函数);如:$("body").on("click","#a1",function(){//代码块});
document.getElementById("div")和$("#div")对象是同一个,但是前者是原生的,后者是封装的(拥有自己的方法和属性),两者不能相互调用,除非类型转换
//动态生成元素<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title></head><body><div><p>a</p><p>b</p><p>c</p></div><button>create</button></body><script type="text/javascript" src="js/jquery-1.12.4.js" ></script><script>$(function(){//添加点击事件$("p").click(function(){$(this).text('click');})//创建一个新节点$("button").click(function(){var p ="<p>new</p>";$("div").append(p);})/*结果证明,click并没有绑定到新的节点上。如果需要给动态的元素绑定事件,需要使用到on()on()方法,可以给未来的元素绑定事件使用方法:1、先选中动态生成元素的父元素2、然后绑定事件3、再选中子类可以理解为给div下的p元素包括未来的p元素绑定click事件,这是比较通俗易懂的理解,详细内容可以看文档的具体说明*/$("div").on("click","p",function(){$(this).text("click");});});</script></html>