Web开发基础_JQuery学习_0001_概述

 JQuery使用方式

案例演示:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery第一个案例</title>
<script src="../js/jquery-1.11.1.js"></script>
<!-- 自定义的js必须在引入jQuery之后写 -->
<script>
	function bigger() {
		//1.获取段落原始字号
		var size = $("p").css("font-size");
		console.log(size);
		//2.字号去掉单位
		size = size.replace("px","");
		//3.字号+1再设置给段落
		$("p").css("font-size",++size+"px");
	}
</script>
</head>
<body>
	<input type="button" value="+"
		onclick="bigger();"/>
	<p>jQuery的使用步骤如下:</p>
	<p>1.引入jQuery文件</p>
	<p>2.使用选择器选中节点</p>
	<p>3.调用API操作节点</p>
</body>
</html>

最终页面显示效果:每点击一次字体便会变大一些

知识拓展:如下图:两个demo1.html内容一致,只是所放置位置不同 ,在源码中都可以跳转到Jquery.js中,但只有day01下的才能正常请求访问。

猜你喜欢

转载自blog.csdn.net/Coder_Boy_/article/details/79053093