JavaWeb JavaScript的事件函数、jQuery的学习

一、javaScript的事件

二、省级联动

做一个省级联动的 注意点:1.onchange 当条目改变的时候所触发的函数
2.this.value 获取到当前选中的value值
3. 拼接html的时候需要注意

三、jQuery

jquery : js 是对javaScript 封装了
1.好处代码量少
2.兼容大部分的浏览器

版本 公司里使用最多的是1.83 jquery2.0 就不支持ie6与ie 的兼容性

一般下载的时候有两个版本: 一个开发版本(min) 小 区别：是否去掉注释与空格
一个测试版本 大

使用jquery 的一个基础步骤:
1.第一步新建一个js文件夹，把jquery 文件放入到js中
2.-在头部进行引入jquery 文件

使用jquery来获取节点:
第一种：jQuery("#tv_text");
第二种: $("#tv_text")
注意点：js 的方法与jquery 的方法不能够互相调用
.val() 获取value 值

js 与jquery 之间的相互转换 ==> Uncaught ReferenceError: $ is not defined 只要是这个错，就是jquery没有引入

                        jquery  转化成js 对象 
                               var  tv_text =$("#tv_text") ;
                              /*把jquery 对象转换成js对象*/
                               var  tv_name=tv_text[0]; 
                               把js转换成jquery对象
                               alert( $(tv_name).val());

jquery 中的准备函数: 准备函数的两种写法:
第一种$(document).ready(function () {alert(‘21347698’);})

第二种：$(function () {alert(‘ddddddd’);});

                         jquery  中三种基本选择器:  $("#notMe") id选择器   $(".notMe") 类选择器  $("div") 标签选择器


                               层叠选择器  $("#tv_main div");  表示的意思是当前 id下的所有div元素（包含孙子）
                                           #tv_main>div 表示的意思是当前 id下的所有div元素（ 不包含孙子）
                                           $("#tv_main+div")  拿的是 id为v_main的第一个兄弟元素
                                           $("#tv_main~div") 拿的是 id为v_main的所有的在之后的兄弟元素
                                
        
                                表单中的属性选择器：  $("[type]");  获取所有type的元素
                                                      $("[type='radio']");  获取所有type=radio 的元素
                                                      $("[type*='o']") 获取到type中包含o的所有的元素
                                                      $("[type='radio'][name='sex']");
                                                        获取到type=radio 并且name=sex 的元素
                                基本过滤选择器：
                                   
                                  $("div:first")  获取第一个div元素                  
                                  $("div:last") 获取最后一个
                                  $("div:even") 匹配所有索引值为偶数的元素，从 0 开始计数
                                  $("div:odd")  匹配所有索引值为奇数的元素，从 0 开始计数
                                  $("div:eq(1)") 匹配一个给定索引值的元素
                                  $("div:gt(1)") 匹配所有大于给定索引值的元素
                                  $("div:lt(1)") 匹配所有小于给定索引值的元素
                                  $("div:not(div:eq(1))") 去除索引为1 的元素

                                  常规查询出是否选择的文本内容
                                   $(":checked");  获取到当前复选框中选中的元素
                                   $(":selected") 获取到当前选中的元素
                                   $(":disabled") 获取到当前不可以点击的元素

                    jquery 操作样式   $("div").addClass("getStr");  $("div").removeClass();

jquery 做验证


jquery 的动画效果 show( speed, [callback] )
表示显示 : 第一个是动画持续的时间(以毫秒值为单位) callback 表示回调函数
hide( speed, [callback] ) 参数的意思是一样的
toggle(); 既显示又可以隐藏

slideDown(5000); slideUp(5000) slideToggle(“slow”); 上下

fadeIn() fadeOut() fadeToggle() 淡入淡出的效果