8.31前端 jQuery
2018-8-31 19:52:09
周末吧这几天课看完 结束前端!然后进行Django!!!
越努力,越幸运!
day56 2018-03-16 1. 内容回顾
1. 样式操作
1. 操作class
2. 操作CSS属性的
.css("color")
.css("color", "green")
.css({"color": "yellow", "border": "1px solid black"})
2. 位置相关
1. .offset()
2. .position() --> 相对于定位的父标签的偏移 3. .scrollTop() --> 返回顶部
$(window).scroll(function(){
...
// 判断窗口距离top有多少
if ($(window).scrollTop() > 100){
// 把返回顶部的按钮显示出来, removeClass("hide");
}
}) // 返回顶部的按钮,要做的事儿
$("返回顶部按钮").click(function(){
// $(window).scrollTop(0);
})
4. .scrollLeft() 3. 尺寸
1. height
2. width 3. innerHeight
4. innerWidth 5. outerHeight
6. outerWidth 4. 文本操作
1. .html() --> 子标签和文本内容
.html("<a href="...">我是a标签</a>")
2. .text() --> 所有的文本内容 3. .val()
获取用户输入的值 $(":text").val()
$(":checked").val() --> 默认返回的都是第一个标签的值 $("#s1").val() --> select可以直接取选中的值,多选的select返回的是数组格式 $("#t1").val() --> textarea和input:text类似
5. 属性操作
1. .attr() --> $("a").attr("href")
$("a").attr("href", "http://www.sogo.com")
$("a").attr({"href":"http://www.sogo.com", "title": "aaaa"}) 2. .prop() --> 适用于checkbox和radio(返回true或false的属性) 2. 今日内容
1. 文档操作 2. 事件 *****
1. 目前为止学过的绑定事件的方式
1. 在标签里面写 onclick=foo(this);
2. 原生DOM的JS绑定 DOM对象.onclick=function(){...}
3. jQuery版的绑定事件 jQuery对象.click(function(){...}) 2. 我们今后要用的jQuery绑定事件的方式
.on("click", function(){...}) $("#t1").on("click", "选择器", function(){...})
适用于 给未来的元素(页面生成的时候还没有的标签) 绑定事件 (事件委托) 事件冒泡和事件捕获
利用事件冒泡,给已经存在的标签绑定事件,用来捕获后代标签的事件. 3. 事件之间
1. 阻止后续事件的执行
显式的写 return false;
2. for循环,退出当前循环 ---> 用break; 4. 补充一个键盘事件
示例:批量操作的
5. DOM加载完之后执行
$(document).ready(function(){
// 写绑定事件的具体操作
});
6. 动画(了解即可) 3. jQuery补充
1. .each循环
1. $.each(a1, function(){...})
2. $("div").each(function(){
console.log(this); --> this指的是每次进入循环的标签
})
2. .data
1. 可以存字符串
2. 可以存数字
3. 可以存jQuery对象
3. 插件机制
1. 给具体的jQuery对象添加扩展
$.fn.extend({
"s9": function(){
...
}
}) 2. 给jQuery添加全局扩展
$.extend({
"s9": function(){
...
}
}) 3. 作业
1. 把课上内容整理博客
2. 把课上的批量操作示例自己写一遍
3. 表格版增删改查
4. 复习Python基础
添加到指定元素内部的后面
内部添加
jQuery 绑定事件 .on
<!DOCTYPE html>
<html>
<head>
<title>02点击在表最后添加记录</title>
<meta charset="utf-8">
</head>
<body>
<table border="" id="t1">
<thead>
<tr>
<th>#</th>
<th>姓名</th>
<th>爱好</th>
</tr>
</thead>
<tbody >
<tr>
<td>1</td>
<td>小强</td>
<td>吃冰淇淋</td>
</tr>
<tr>
<td>2</td>
<td>二哥</td>
<td>吃冰淇淋</td>
</tr>
</tbody>
</table>
<button id="b1">添加一行数据</button>
<script type="text/javascript" src="jquery-3.2.1.min.js"></script>
<script >
// 绑定事件
$("#b1").click(function () {
// 生成要添加的tr标签及数据
var trEle = document.creatElement("tr");
$(trEle).html("<td>3</td><td>小东北</td><td>社会摇</td>");
//把生成的tr插入到表格中
$("#t1").find("tbody").append(trEle);
}) </script>
</body>
</html>
# 2018-8-31 19:45:53
# 面试考的基础知识,要扎实!!!!! 手写!!!! # 可变对象不能做关键字参数
# def foo(arg, li=[]):
# li.append(arg)
# return li # li.append() 没有返回值
# def foo(arg, li=[]):
# return li.append(arg) # list1 = foo(21)
# list2 = foo(21, [1, ])
# list3 = foo(28) # print(list1)
# print(list2)
# print(list3) list5 = [11, 22, 33, 44, 55]
# 切片,从索引第十个切到后面
print(list5[10:]) # 打乱列表的顺序
import random random.shuffle(list5)
print(list5)
8.31前端 jQuery的更多相关文章
- Web前端JQuery入门实战案例
前端jquery入门到实战 为什么要学习Jquery?因为生活. 案例: <!DOCTYPE html> <html lang="zh-CN"> <h ...
- Web前端JQuery面试题（三）
Web前端JQuery面试题(三) 1.怎么阻止冒泡过程? stopPropagation(); // 阻止冒泡过程 2.ready()方法和onload()方法的区别? onload()方法要等页面 ...
- Web前端JQuery面试题（二）
Web前端JQuery面试题(二) 1.请写出jquery的语法? <script type="text/javascript"> $(document).ready( ...
- Web前端JQuery面试题（一）
Web前端JQuery面试题(一) 一:选择器 基本选择器 什么是#id,element,.class,*,selector1, selector2, selectorN? 答: 根据给定的id匹配一 ...
- 关于前端 jQuery 面试的知识点
参考一个博主整理的一些前端 jQuery 的一些面试题 参考博客:https://www.cnblogs.com/dashucoding/p/11140325.html 参考博客:https://ww ...
- 前端 jQuery副本
jQuery介绍 jQuery是一个轻量级的.兼容多浏览器的JavaScript库. jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互, ...
- Python之Web前端jQuery扩展
Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...
- web前端-----jQuery
web前端之jQuery篇 一 jQuery是什么? ［1］ jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. ［2］ j ...
- web前端----jQuery操作标签
样式操作 样式类 addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名. hasClass();// 判断样式存不存在 toggleClass() ...
随机推荐
- BarTender怎么打印公式化的三列标签
有小伙伴在业务上有这样的需求:使用BarTender打印一行三列的标签,如下A,B,C三个并排.第一行 A1=a B1=a*2-1 C1=a*2:第二行 A2=a+1 B2=(a+1)*2-1 C2= ...
- Python游戏《外星人入侵》来了~
在游戏<外星人入侵>中,玩家控制着一艘最初出现在屏幕底部中央的飞船.玩家可以使用箭头键左右移动飞船,还可使用空格键进行射击.游戏开始时,一群外星人出现在天空中,他们在屏幕中向下移动.玩家的 ...
- HTML标签嵌套规则
摘要: 最近在整理项目时发现有些同事写的页面代码嵌套的太多,而且有些嵌套不对,比如<a><div>内容</div></a>.虽然功能实现了,但是对于浏 ...
- 使用srvany.exe把程序安装成windows服务的方法
http://mazhihui.iteye.com/blog/1294431 srvany.exe是什么? srvany.exe是Microsoft Windows Resource Kits工具集的 ...
- 8 -- 深入使用Spring -- 3...1 Resource实现类InputStreamResource、ByteArrayResource
8.3.1 Resource实现类------InputStreamResource:访问输入流资源的实现类.ByteArrayResource:访问字节数组资源的实现类. 5. 访问字节数组资源 ⊙ ...
- MySQL用户认证及权限控制
一.MySQL用户认证: 登录并不属于访问控制机制,而属于用户身份识别和认证: 1.用户名—user 2.密码—password 3.登录mysqld主机—host 实现用户登录MySQL,建立连接. ...
- （转）作为一个新人，怎样学习嵌入式Linux？(韦东山）
被问过太多次,特写这篇文章来回答一下. 在学习嵌入式Linux之前,肯定要有C语言基础.汇编基础有没有无所谓(就那么几条汇编指令,用到了一看就会).C语言要学到什么程度呢?越熟当然越好,不熟的话也 ...
- vc 使用ShellExecut来启动控制面板中功能模块的操作
文件夹,文件,网址可以创建快捷方式,控制面板 中的设置也可以创建快捷方式,下面是快捷方式的命令,使用方法:在桌面或文件夹的空白处点右键,选择新建,快捷方式,在“请键入项目的位置”输入下面的命 令,然后 ...
- LINK : warning LNK4098: 默认库“LIBCMT”与其他库的使用冲突；请使用 /NODEFAULTLIB:library
解决方法 属性=>配置属性=>输入=>忽略特定库LIBCMT
- GitHub上整理的一些工具【转载】
技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应用,关注软件开发领域 ...