• JSP学习笔记【三】——JQuery


    前言

    在写项目的时候需要动态对某组件的属性进行调整,我看网上的教程都是使用document.getElementById等,但我在eclipse编写.jsp文件的时候,却提示document cannot be resolved。由于我对jsp没有系统的了解以及无人可咨询,网上也没遇到过相关解释,所以至今无解。通过查阅各种资料作出猜测如下:

    1. 可能是因为document只能写在.html文件中的标签内。

      selector

      类型选择符含义
      $(this).action()对当前元素操作
      元素选择器$("p").action()对所有段落(p)操作
      元素选择器$("p.intro").action()对所有class="intro"的段落(p)操作
      元素选择器$("p#demo").action()对所有id="demo"段落(p)操作
      $(".test").action()对class="test"的所有元素操作
      $("#test").action()对所有id="test"的元素操作
      属性选择器$("[href]").action()对所有带有href属性的元素操作
      属性选择器$("[href='#']").action()对所有href值等于"#"的元素操作
      属性选择器$("[href!='#']").action()对所有href值不等于"#"的元素操作
      属性选择器$("[href$='.jpg']").action()对所有href值以".jpg"结尾的元素操作
      $("ul li:first").action()对每个
        的第一个
      • 元素操作
      $("div#intro .head").action()对id="intro"的
      元素中的所有class="head"的元素操作

      完整参考手册:jQuery 参考手册 - 选择器

      action()

      事件

      jQuery 事件处理方法是 jQuery 中的核心函数。事件处理程序指的是当 HTML 中发生某些事件时所调用的方法。通常会把 jQuery 代码放到 部分的事件处理方法中

      事件含义
      ready(function(){})将函数绑定到文档的就绪事件(当文档完成加载时)
      click(function(){})触发或将函数绑定到被选元素的点击事件
      dblclick(function(){})触发或将函数绑定到被选元素的双击事件
      focus(function(){})触发或将函数绑定到被选元素的获得焦点事件
      mouseover(function(){})触发或将函数绑定到被选元素的鼠标悬停事件

      完整参考手册:jQuery 参考手册 - 事件

      ※ ready()

      所有jQuery函数需要位于一个document ready函数中:

      $(document).ready
      (
      	function()
      	{
        		// jQuery functions go here
      	}
      );
      
      • 1
      • 2
      • 3
      • 4
      • 5
      • 6
      • 7

      这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码。

      如果在文档没有完全加载之前就运行函数,操作可能失败。下面是两个具体的例子:

      • 试图隐藏一个不存在的元素
      • 获得未完全加载的图像的大小

      效果

      效果一般配合事件使用,例如当鼠标点击时进行的某种操作,写在function(){}里。

      效果含义备注
      css(“background-color”,“red”)改变css属性
      hide(speed,callback)隐藏speed参数(可选)规定隐藏/显示的速度,callback参数(可选)是隐藏或显示完成后所执行的函数名称。
      show(speed,callback)显示
      toggle(speed,callback)切换显示和隐藏

      重定向

      JQuery是在页面全部加载完毕后对某些html组件进行操作,因此如果在