第十九篇 jQuery初步学习
jQuery 初步学习
jQuery 是一个 JavaScript 函数库。
jQuery 库包含以下特性:
- HTML 元素选取
- HTML 元素操作
- CSS 操作
- HTML 事件函数
- JavaScript 特效和动画
- HTML DOM 遍历和修改
- AJAX
- Utilities
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>jQuery 初步学习</title>
<!--引用jQuery脚本,否则无法使用jQuery编程-->
<script src="../js/jquery-1.12.2.min.js"></script>
</head>
<body>
<div>我是第一个div,单击我,我就隐藏</div>
<div>我是第2个div,单击我,我就隐藏</div>
<div>我是第三个div,单击我,我就隐藏</div> <p>我是p标签,单击我,显示所有div</p> <h3 id="myp">点击我,弹出一个介绍框</h3>
<script>
//jQuery的事件,都不需要on开头了,就是说原本JS实现onclick,这里的jQuery不需要on,有on就是错误的
//jQuery的关键,用$符号开头,然后找到对应的元素,ID,class,来进行操作,这里我们找的是元素
$("div").click(function (){
$(this).hide();
//this是本身的意思,就是说,
//这里三个div,当我鼠标指向一个div的时候,我只会操作这个div
//而不会影响到其他的div元素,this可以很方便的控制多个元素和class,ID就不需要了,因为它是唯一的
});
//这里的意思是,我点击p元素,则显示所有的div元素
$("p").click(function(){
$("div").show();
//show()函数,即为显示,hide()函数,则是隐藏。
});
//指向ID,则需要在前面加一个# ,指向class前面加一个 . 就跟css是一样的
$("#myp").click(function(){
alert('嗨,同学们好,我是jQuery');
});
</script>
</body>
</html>
第十九篇 jQuery初步学习的更多相关文章
- 第二十篇 jQuery 初步学习2
jQuery 初步学习2 前言: 老师这里啰嗦一下,因为考虑到一些同学,不太了解WEB前端这门语言.老师就简单的说一下,写前端,需要什么:一台笔记本.一个文本编辑器.就没啦!当然,写这门语言, ...
- Egret入门学习日记 --- 第十九篇(书中 8.8~8.10 节 内容)
第十九篇(书中 8.8~8.10 节 内容) 开始 8.8节. 重点: 1.类型推断. 2.类型强制转换,使其拥有代码提示功能. 3.除了TS自带的类型判断,Egret官方也提供了类型判断的方法. 操 ...
- Python之路【第十九篇】:爬虫
Python之路[第十九篇]:爬虫 网络爬虫(又被称为网页蜘蛛,网络机器人,在FOAF社区中间,更经常的称为网页追逐者),是一种按照一定的规则,自动地抓取万维网信息的程序或者脚本.另外一些不常使用 ...
- Android UI开发第三十九篇——Tab界面实现汇总及比较
Tab布局是iOS的经典布局,Android应用中也有大量应用,前面也写过Android中TAb的实现,<Android UI开发第十八篇——ActivityGroup实现tab功能>.这 ...
- jquery 初步学习
首先 jQuery是一个轻量级的 JS框架,核心文件才几十KB 1. jquery 对象 var $variable=jquery对象 var variable = DOM对象 $variable[0 ...
- 第二十六篇 jQuery 学习8 遍历-父亲兄弟子孙元素
jQuery 学习8 遍历-父亲兄弟子孙元素 jQuery遍历,可以理解为“移动”,使用“移动”还获取其他的元素. 什么意思呢?老师举一个例子: 班上30位同学,我是新来负责教这个班学生的老师 ...
- 第二十五篇 jQuery 学习7 获取并设置 CSS 类
jQuery 学习7 获取并设置 CSS 类 jQuery动态控制页面,那么什么是动态呢?我们就说一下静态,静态几乎又纯html+css完成,就是刷新页面之后,不会再出现什么变动,一个实打实的静态 ...
- 第二十四篇 jQuery 学习6 删除元素
jQuery 学习6 删除元素 上节课我们做了添加元素,模拟的是楼主发的文章,路人评论,那么同学们这节课学了删除之后,去之前的代码上添加一个删除,模拟一个楼主删除路人的评论. jQuery的删除方 ...
- 第二十二篇 jQuery 学习4 内容和属性
jQuery 内容和属性 这节课,我们学习使用jQuery来控制元素的内容.值和属性. html() 控制所选元素的内容(包括HTML标记): text() 控制所选元素的内容: val() ...
随机推荐
- java实现几种常用排序:选择排序
一.选择排序介绍 选择排序,顾名思义就是用逐个选择的方式来进行排序,逐个选择出数组中的最大(或最小)的元素,直到选择至最后一个元素.此时数组完成了排序. 二.选择排序原理分析 三.选择排序代码实现 / ...
- js 执行总结1
一. function sayHi() { let x; let y; try { throw new Error(); } catch (x) { // 局部 x = 1; console.log( ...
- Dropdown 下拉菜单
将动作或菜单折叠到下拉菜单中. 基础用法 移动到下拉菜单上,展开更多操作. 通过组件slot来设置下拉触发的元素以及需要通过具名slot为dropdown 来设置下拉菜单.默认情况下,下拉按钮只要ho ...
- SQL学习(六)select into:复制表信息
在实际工作中,可能需要将一个表中的数据复制到另一个表中,以供后续使用.此时可以用关键字select into(在MySQL中不支持select into,可使用insert into...select ...
- java源码-HashMap源码分析
这次开始分析JDK8中的HashMap源码. 首先理解HashMap中几个关键变量, TREEIFY_THRESHOLD 链表转换红黑树扩容值 table 数组+链表+红黑树 size 当前存储数 ...
- 进程,虚拟环境,Mysql主从
进程 查看进程 ps(类似windows任务管理器) man 1 ps # 查看命令文档 ps[options] 1 UNIX options, which may be grouped and mu ...
- CentOS7 执行yum 命令出错
http://blog.csdn.net/weicuidi/article/details/52935100 https://www.cnblogs.com/pqchao/p/6428947.html
- webrtc实现点对点视频通讯
html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...
- flask 之(四) --- 扩展|缓存|会话
扩展 蓝图内置扩展 (实现的是路由的拆分) '''----------- app.py -------------''' from flask import Flask from users_view ...
- cisco RIP(传闻协议)Routing information protocol
Corp(config)#rout rip Corp(config-router)#network 10.0.0.0 10.0.0.0/24 is subnetted, 5 subnets C 10. ...