python点击事件onclick_巨蟒python全栈开发数据库前端6:事件onclick的两种绑定方式onblur和onfocus事件window.onload解释小米商城讲解...
1.回顾上节内容(JavaScript)
一.JavaScript概述
1.ECMAScript和JavaScript的关系
2.ECMAScript的历史
3.JavaScript是一门前后端都可以写的一门语言,操作和浏览器的一些交互的内容,也可以操作文档树,html其实就是一颗文档树.
4.ES6就是指ECMAScript6
尽管ECMAScript是一个重要标准,但它并不是JavaScript唯一的部分,当然,也不是唯一被标准化的部分,实际上一个完整的JavaScript实现由以下3个部分组成:
核心(ECMAScript)
文档对象模型(DOM):Document object model(整合js,css,html)
浏览器对象模型(BOM):Browser object model(整合js和浏览器),这个指的是和浏览器进行打交道.js本身可以和浏览器打交道,也就是操作浏览器,通过浏览器实现某些效果
5.js可以操作html对象内的所有内容
6.js引入方式,直接在html中的
7.js中的语句以分号(;)为结束符,也就是说和索引没有关系
8.JavaScript语言基础
(1)变量声明
(2)JavaScript的数据类型:数值(Number)//字符串(String)[字符串的一些操作](重点)!!!!!//布尔值(Boolean)
JavaScript拥有动态类型(python也是动态的)
一定要多写,多写才会明白,才会清楚
(3)NaN,表示不是一个数字(Not a Number),也就是说是一个值,但不是数字
(4)字符串中的 .trim()属性是得到一个新值,移除空白
(5)后边的项目主要是针对BOM和DOM的操作,也就是熟练前面的HTML+JS+CSS
(6)后边的jquery用的比较多,但是这个也是很重要的.
(7)js中的数值类型,不区分整形和浮点型,就只有一种数字类型.
(8)null(空)和underfined(未定义)
(9)数组类型,对比python中的列表(重点concat连接//sort排序有点复杂//splice(三个参数,删除并添加新元素),常用排序)
(10)for循环,循环的写法==>数组通过索引取值
(11)对象(Object):JavaScript中的所有事物都是对象:字符串,数值,数组,函数...js允许自定义对象.
对象只是带有属性和方法的特殊数据类型.
数组:(重点)对比python中的列表
(12)注意:后边项目中用的最多的还是jquery和bootstrap.js基础还是用得到的,js中BOM和DOM用的还是比较少的
(13)
typeof null //"object"typeof undefined //"undefined"typeof NaN //"number"
(14)foreach() (等学到后面再说这个)
(15)splice()
(16)map() (后面再讲)
(17)自定义对象
(18)类型查询
(19)运算符
算术运算符
比较运算符
逻辑运算符
赋值运算符
(20)流程控制
if-else
if-else if-else #多条件
switch切换
for遍历
while
三元运算
二.js函数:
1函数定义
2.
(1)普通函数定义
(2)带参数的函数 //内置的arguments对象
(3)带返回值的函数
(4)匿名函数方式,多和其他函数配合使用,后边会用到
(5)立即执行函数,页面加载到这里,这个函数就直接执行了,不需要被调用执行
(6)=>, 定义函数,可以理解为匿名函数,但是用的不多
(7)函数中的arguments参数(看一下就行了)
注意:函数只能返回一个值,如果返回多个值,只能讲其放在数组或对象中返回
(8)函数的全局变量和局部变量和变量生存周期
(9)作用域:首先在函数内部查找变量,找不到则到外层函数查找,逐步找到最外层.
3.闭包:内层函数调用外层函数的变量
(10)词法分析(深坑),把重点放在案例上,词法分析的过程不太容易懂
(11)内置对象和方法(下图初步分析)
(12)自定义对象
图1
创建对象:
图2
注意:
ES6中提供了Map数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当做键。
也就是说,Object结构提供了“字符串--值”的对应,Map结构提供了“值--值”的对应,是一种更完善的Hash结构实现。
map的使用:(map也是了解内容,有兴趣的可以研究一下)
(13)扩展:JavaScript面向对象之继承:(目前作为了解)
(14)Date对象:
A:创建Date对象
B:Date对象的方法:
(15)json对象,实现前后端交互
(16)RE模块(RegExp对象),正则(内容很多,用到了再看),复习的时候再看
(17)Math对象,类似于python的内置函数
三.前端基础之BOM和DOM
超哥blog:
https://www.cnblogs.com/clschao/articles/10092991.html
(1)window对象
(2)navigator对象(了解即可)
(3)location
test:
(4)弹出框
可以再JavaScript中创建三种消息框:警告框,确认框,提示框.
alert是用来作为弹出框的,但是这个不能在浏览器中写,这个没有什么显示效果,只有返回true
(5)计时器
test结果:
(6)DOM
1.查找标签
直接查找
document.getElementById 根据ID获取一个标签
document.getElementsByClassName 根据class属性获取(可以获取多个元素,所以返回的是一个数组)
document.getElementsByTagName 根据标签名获取标签合集
代码测试1:
获取div标签
(7)间接查找
(8)节点操作
创建节点(就是创建标签)
添加节点
删除节点
替换节点
属性节点
var divEle = document.getElementById("d1")
divEle.innerText#输入这个指令,一执行就能获取该标签和内部所有标签的文本内容
divEle.innerHTML #获取的是该标签内的所有内容,包括文本和标签
attribute操作
获取值操作
class操作提取css操作
test1:
test3:
test4:
Title
python点击事件onclick_巨蟒python全栈开发数据库前端6:事件onclick的两种绑定方式onblur和onfocus事件window.onload解释小米商城讲解...相关推荐
- 全栈开发之前端开发-欧阳桫-专题视频课程
全栈开发之前端开发-117人已学习 课程介绍 无论是Java猿.PHP猿.还是Python猿: 无论你身处天堂还是地狱,过去还是未来: 无论你的女朋友在左边还是右边... 你逃不开生死 ...
- 视频教程-全栈开发之前端开发-HTML5/CSS
全栈开发之前端开发 多年互联网从业经验: 有丰富的的企业网站.手游.APP开发经验: 曾担任上海益盟软件技术股份有限公司项目经理及产品经理: 参与项目有益盟私募工厂.睿妙影音家庭物联网设备.手游东方江 ...
- java两种绑定方式_Javascript绑定事件的两种方式的区别
命名函数 function check(){ //code } 匿名函数 window.onload = function(){ //先获取元素对象,再绑定事件,绑定的是匿名函数不可重用 var bt ...
- android密码dakay,安卓中按钮点击事件onClick的两种实现方式
很多的语言都有一些共同的特点,比如OnClick这个东西,可能我们能在js中见到,当然在安卓中也有,可能其他的编程语言也会有这个东西,刚好今天学了这个玩意在安卓中的写法. 点击事件大多用在Button ...
- python 全栈开发,Day51(常用内置对象,函数,伪数组 arguments,关于DOM的事件操作,DOM介绍)...
昨日内容回顾 1.三种引入方式1.行内js <div onclick = 'add(3,4)'></div>//声明一个函数function add(a,b){}2.内接js& ...
- python 全栈开发,Day62(外键的变种(三种关系),数据的增删改,单表查询,多表查询)...
一.外键的变种(三种关系) 本节重点: 如何找出两张表之间的关系 表的三种关系 一.介绍 因为有foreign key的约束,使得两张表形成了三种了关系: 多对一 多对多 一对一 二.重点理解如果找出 ...
- Python爬虫开发:url中文字符编码的两种解决方式
- spring boot + vue + element-ui全栈开发入门——前端编辑数据对话框
需求 1.点击"添加"按钮,弹出录入数据的对话框窗口,并录入数据,如果数据有误则不允许提交.数据填写完毕后,点击"保存"按钮,调用http协议提交数据,提交完 ...
- 微信小程序 基础3【组件化开发、自定义组件、全栈开发、使用Express】
视频地址: https://www.bilibili.com/video/BV1cW411T7t6 [2018]学做小程序- 清华大学 https://www.bilibili.com/video/ ...
最新文章
- python模块之image修改图片类型
- Java类加载笔记(1)
- POJ 1185 解题报告 炮兵阵地
- NDK 原生代码处理图形
- 树莓派python开发工具哪个好_Thonny——树莓派上Python的最新IDE
- Ext.Net系列:二Event之DirectEvent 示例2(Delay)
- 理解Java - 线程池
- 安装VMware,主机键盘不能用解决方法
- Mac 抓包工具Charles4.0.2破解版,安装使用
- 世界各国发展指标(1960-2019)
- vb.net 教程 5-19 拓展:制作一个QQ大家来找茬和美女找茬辅助工具
- 网站如何做域名转移?闲置域名要及时处理
- 机房动力环境监测解决方案
- arm服务器测评_某ARM服务器与X86服务器简单性能对比
- apicloud 不干胶标签打印模块及开发
- 干货|什么是字节码?字节码扩展名是什么?
- nodejs+vue音乐网站与分享平台
- 用python实现爬取CSDN热门评论URL并存入redis
- 细胞是怎样衰老、自杀和癌变的?
- 数据结构——二叉树的建立与遍历算法(实验报告)