Jquery简介
程序员文章站
2022-07-16 08:35:22
...
1. Jquery简介
Jquery官网：http://www.jquery.com/
Jquery官网：http://www.jquery.com/
jQuery是一个JavaScript函数库
jQuery2.0及后续版本将不再支持IE6/7/8浏览器
onload在body加载完毕执行init方法相当于Jquery的$(document).ready(function(){});
chap01/demo01.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
<script type="text/javascript">
function getContent(){
// var content = document.getElementById("content").value;
var content = $("#content").val();
alert(content);
}
</script>
</head>
<body>
<input type="text" id="content"/> <input type="button" value="获取内容" onclick="getContent()"/>
</body>
</html>
chap01/demo02.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
<script type="text/javascript">
/* function getContent(){
// var content=document.getElementById("content").value;
var content=$("#content").val();
alert(content);
} */
/* function init(){
document.getElementById("actionButton").onclick=function(){
var content=document.getElementById("content").value;
alert(content);
}
} */
$(document).ready(function(){
$("#actionButton").click(function(){
alert($("#content").val());
});
});
</script>
</head>
<body>
<input type="text" id="content"/> <input type="button" id="actionButton" value="获取内容" />
</body>
</html>
上一篇： Jquery选择器