使用jQuery特效完成一个用于显示职工信息的HTML表格

认识jQuery
**前言:**关于jQuery的简述,jQuery是一个快速的,简洁的JavaScript库,它使用户能够更方便地处理对象模型(Document Object Model,DOM)、事件,以及实现动画效果等,并且能方便的为网站提供Ajax交互。概括的说,jQuery是基于JavaScript语言的框架编程,根据实际应用中常见需求对JavaScript的功能进行封装,提供函数接口,简化了JavaScript语言的框架编程,根据实际应用中常见的需求对JavaScript的功能进行封装,提供函数接口,简化了JavaScript的操作,提倡“以更少的代码做更多的事情”。

1.首先用MuGet获取第三方库也就是jQuery程序包(注意这里计算机需要接入互联网哦,说到这里就要顺便提一下VS的优缺点了,VS是一个很大的软件,用过的程序设计者都知道它可以使用多种语言进行编写,比如面向过程程序设计C,面向对象程序设计C++,面向对象程序设计Java,以及C#等,虽然一个软件拥有如此强大的功能,但是正因为这样造成很多不必要空间浪费,因此对于满足不同种类的需求,微软公司也进行了灵活的设计,在我们拥有基础的功能上,保留我们对更多功能需求的需要,这时我们就需要接入互联网下载一些第三方库之类的文件包啦)
通过VS(笔者使用的是VS2015)建立一个ASP.NET网站后在解决方案资源管理器中右击网站名称,在弹出的快捷菜单中选择“管理NuGet程序包”命令(如下图)
在这里插入图片描述
点击后接入以下界面(如下图)
点击浏览在这里插入图片描述
(单击“浏览”)
找到jQuery并单击这时会出现下载界面,单击安装(如下图)
在这里插入图片描述
在这里插入图片描述
这时右侧的解决方案资源管理器中会出现Script文件夹其中包括jQuery的相关文件。(如下图)
在这里插入图片描述
2.下载并部署完成后,这时笔者需要对刚刚完成的Script文件进行一个功能说明(如下图)
在这里插入图片描述
这里的功能说明后面因为完成程序调用时会遇到,所以这里提前说明一下,我们基本上用在网站上时会使用.min.js文件类型。同时引用jQuery时注意在.aspx中之间添加引用jQuery文件的代码
3.现在开始正式的程序设计了,笔者这里贴上部分HTML代码(这里笔者不进行详细的说明了这是我们根据页面效果进行设计的)
在这里插入图片描述
页面初始效果图(如下)
在这里插入图片描述
4.添加“StyleSheet.css”样式表文件,编写css文件代码。(解决方案管理器添加样式表里)这里笔者展示部分代码(如下图)
在这里插入图片描述
5.这时记得在笔者前面提到的,也就是.aspx中添加对jQuery的引用文件代码(下图)
在这里插入图片描述
这里需要大家特别注意哦,这里引用的jQuery的版本号可不能直接参考《ASP.NET程序设计(C#版)》第三版(崔淼版)里的3.1.1.min.js版本号哟,如果是刚刚从NuGet里下载的这里的版本引用应该是3.5.1.min.js才对,否则对不上号就调用不上了哈,这里有点类似本科低年级学习的C程序设计以及C++程序设计里函数的调用。
6.继续向.aspx里添加jQuery代码(部分代码展示)
在这里插入图片描述
7.调试展示
1)页面初始效果
在这里插入图片描述
2)选中此行,但不选中此行行首的按钮此选中行呈高亮状态
在这里插入图片描述
3)选中此行行首的按钮,此行呈高亮状态与只选择此行而不选择此行行首按钮呈高亮状态进行对比的效果图
在这里插入图片描述
8.总结
欢迎指正笔者在描述过程中出现的问题,希望大家能够熟练对jQuery的使用。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值