jQuery方法

来源：互联网发布：服装设计淘宝编辑：程序博客网时间：2024/04/26 06:12

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'ajax.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript"src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
//在jquery内，能够获取就能够设置
function testA(){
var name=$("#name").val();
alert(name);
name="mimi";
alert(name);
$("name").val("mimi2");
alert(name);
}
//attr方法
function testB(){
alert($("#name").attr("value"));
alert($("#name").attr("type","button"));
}
//css方法
function testC(){
$("").css("","");
}
function testD(){
$("p").css("color","pink");
}
function testE(){
$("p").height(40);
}
//click方法
function testF(){
$("p").click(function(){
$(this).hide();
});
}
$(document).ready(
function(){
$("#zz").click(function(){
alert("哈哈哈");
});
}

);
//ready()函数不应与<body onload="">一起用
￥("p").blur( function () {
alert("Hello World!");
} );
</script>

</head>

<body>
<input type="text" id="name" value="123"/>
<p>智障儿童欢乐多</p>
<input type="button" value="提交" onclick="testA()"/>
<input type="button" value="豆豆" onclick="testB()"/>
<input type="button" value="智障" onclick="testD()"/>
<input type="button" value="啊咧" onclick="testE()"/>
<input type="button" value="阿西吧" onclick="testF()"/>
<input id="yy"type="button" value="少年" onclick="testG()"/>
<input id="zz" type="button" value="二货"/>
<div>
<p style="background-color: #FCF">为啥弄不好</p>
</div>
</body>

</html>

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'after.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
//在标签后插入方法
function testA(){
$("#divID").append("<span style='color:red'>，啊咧咧</span>");
}
function testB(){
$("div").appendTo("<span style='color:red'></span>");
}
//after方法
function testC(){
$("p").after("<b>哈哈哈</b>");
}
//show方法
function testD(){
$("p").show();
}
//text方法
function testE(){
alert($("li:first").text());
alert($("li:last"));
}
function testF(){
alert($("input:not(:checked)").val());
}
//eq事件及gt事件
function testG(){
alert($("tr:eq(1)"));
alert($("tr:gt(1)"));
}
//checked事件
function testH(){
alert($("input[name='new']").attr("checked"),true);
}
//表单事件
function testI(){
alert($("select option:selected"));
}
function testJ(){
alert($("div").children().val());
}
</script>
</head>
<body>
<div id="divID" onclick="testA()">
想请假
</div>
<p>猪，你的鼻子有两个洞</p>
<div></div><div></div>
<ul id="ulID" onclick="testE()">
<li>葡萄</li>
<li>芒果</li>
<li>水蜜桃</li>
</ul>
<div id="che" onclick="testG()">
<input name="apple"/>
<input name="foler" checked="checked"/>
</div>
<table id="ulID" onclick="testF()">
<tr><td>葡萄</td></tr>
<tr><td>芒果</td></tr>
<tr><td>水蜜桃</td></tr>
</table>
<div onclick="testH()">
<input type="checkbox" name="new" value="Hot"/>
<input type="checkbox" name="new" value="Hot"/>
<input type="checkbox" name="xin" value="but"/>
</div>
<select>
<option value="1">苹果</option>
<option value="2">荔枝</option>
<option value="3">小西瓜</option>
</select>
<p>HELLO</p>
<div>
<span>Hello word</span>
</div>
<p>HELLO WORD</p>
</body>
</html>

阅读全文

0 0