这里写的很详细
总结:
1.js对象:var a=documnet.getElementById("123"),对应的操作:a.innerHTML+="sss";
2.jq对象: var $a=$(a);
详细参考
一:
jQuery 对象是通过 jQuery 包装DOM 对象后产生的对象。jQuery 对象是 jQuery 独有的,其可以使用 jQuery 里的方法,但是不能使用 DOM 的方法;例如: $("#img").attr("src","test.jpg");
这里的 $("#img")就是 jQuery 对象。
DOM对象就是Javascript 固有的一些对象操作。DOM 对象能使用Javascript 固有的方法,但是不能使用 jQuery 里的方法。例如:document.getElementById("img").src = “test.jpg";
这里的document.getElementById("img") 就是DOM 对象。
$("#img").attr("src","test.jpg"); 和 document.getElementById("img").src = "test.jpg"; 是等价的,是正确的,
但是 $("#img").src = "test.jpg" ;或者 document.getElementById("img").attr("src","test.jpg"); 都是错误的。
jquery代码参考
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
</head>
<body>
<ul>
<li>list item 1</li>
<li>list item 2</li>
<li class="third-item">list item 3</li>
<li>list item 4</li>
<li>list item 5</li>
</ul>
<script>
$('li.third-item').next().css('background-color', 'red'); //必须掌握的语法
</script>
</body>
</html>
这个例子的结果是,只有list item 4背景色变为红色
二:
再说一个例子,就是this, 在写 jQuery 时经常这样写: this.attr("src","test.jpg");可是就是出错,其实this 是DOM对象,而.attr("src","test.jpg") 是 jQuery 方法,所以出错了。
要解决这个问题就要将 DOM对象转换成 jQuery 对象,
例如 $(this).attr("src","test.jpg");
3.ajax 是一种特殊的 jqery;格式
$.ajax( //参数
{ //jason对象:{a:b,c:d,e:{}} 格式 需要引入jason的jar包
}
)
4.el表达式:jsp中:
javabean,el如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%> // 一:isELIgnored="false"
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<p >你好,亲爱的:</p>${U.getUsername() } //二:传统javabean:<%= (User)request.getAtrribute("U").getUsername()%>
<p >欢迎登录!</p>
</body>
</html>
jq,ajax,jason,如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- 源生:js -->
<script type="text/javascript" >
</script>
<!-- js:之后的jQuery -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> //jquery需要引入jar包,或者可以用百度链接
<script type="application/javascript">
function appeard(){
$.ajax(
{
url:"sss",
success:function(response){
alert(response);
},
error:function(){
alert("下载失败");
}
}
)
}
function appear(){
$.ajax({
url:"sss",
success:function(response){
alert("即将显示");
$("img").attr("src","./images/a.jpg"); //jq格式
},
error:function(){
alert("显示失败");
}
}
)
}
</script>
</head>
<body>
<button onclick="appeard()">
请点击下载图片
</button>
<button onclick="appear()">
请点击显示
</button>
<div></div>
<img >
</body>
</html>
jstl
1.导包---jstl
2.引入
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<body>
<c:if test="{user}">sss</c:if>
</body>
e.g:
<td>
<input type="radio" name="ugender" value="男" <c:if test="${user.ugender=='男' }">checked="checked"</c:if>/>男
<input type="radio" name="ugender" value="女" <c:if test="${user.ugender=='女' }">checked="checked"</c:if>/>女