HTML5入门(JQuery基础运用一)

最新推荐文章于 2024-05-14 00:06:07 发布

flyinbed_

最新推荐文章于 2024-05-14 00:06:07 发布

阅读量3.2k

点赞数 2

分类专栏： HTML5 文章标签： HTML5 入门

本文链接：https://blog.csdn.net/flyinbed_/article/details/80222050

版权

HTML5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

JQuery之JS框架下载运用

由于公司需求需要转型前端。。。于是就有了接下来的H5入门笔记，边学边做笔记养成良好习惯。

JQuery对一个新人来说真的是入门首选啊，简单高效，而且还自带兼容非常nice

废话不多说先上下载链接

JQuery下载

打开链接进入以下界面

第一个 Download 下载

第二 API 使用文档

第三 Blog 博客

第四 Plugins 插件

第五 Browser Support 游览器支持

由于最新版本的已经舍弃了IE8了为了满足产品经理的变态需求所以我们需要找兼容IE8的历史版本了

所以我们点击 Browser Support 然后显示出以下界面

如果您需要支持Internet Explorer 6-8，Opera 12.1x或Safari 5.1+等较旧的浏览器，请使用jQuery 1.12。

网页很温馨的提示了，所以点击JQuery_1.12

这里有两个选项，一个是完整版，第二个是压缩版，对于我们新人来讲下载第一个就好了。要是项目要发布的话可以替换成第二个

我这里选择了1.12.1

下载好了就是一个普通的JS文件，接下来我们只要放到自己项目的根目录就好了

在页面上添加JQuery的引用，看这代码量是不是很简单，下面是代码我用的编译工具是 Sublime

<!DOCTYPE html>
<html>

<!-- 记得在这里添加引用 -->
<script src="jquery-1.12.1.js"></script>
<script type="text/javascript">
	//当控件加载完成执行此方法
	$(function() {
		//获取div的ID并设置点击事件
		$("#asd").click(function() {
			//div点击完成改变里面的内容
			$("#asd").text("我被改变了。。。")
		});
	});


</script>
<head>
	<title></title>
</head>
<body>

	<div id="asd" >我是原来的</div>
</body>
</html>

flyinbed_

关注

2
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
HTML5入门(JQuery基础运用一)

JQuery之JS框架下载运用由于公司需求需要转型前端。。。于是就有了接下来的H5入门笔记，边学边做笔记养成良好习惯。JQuery对一个新人来说真的是入门首选啊，简单高效，而且还自带兼容非常nice废话不多说先上下载链接JQuery下载打开链接进入以下界面第一个 Download 下载第二 API 使用文档第三 Blog 博客第四 Plugins 插件第五 Browser Support 游览器...
复制链接

扫一扫