第六十五天 js操作
1.闭包
// 函数的嵌套定义,定义在内部的函数都称之为 闭包
// 1.一个函数要使用另一个函数的局部变量
// 2.闭包会持久化包裹自身的函数的局部变量
// 3.解决循环绑定
function outer(){
var num = 10;
function inner(){ // 闭包
// 1.在inner函数中,使用了outer的局部变量num
return num;
}
return inner;
}
var innerFn = outer();
// 2.借助闭包,将局部变量num的生命周期提示了
var num = innerFn();
console.log(num);
2.面向对象js
// 1.单一对象
var obj = {
// 属性
name:'zero';
// 方法
teach:function(){
console.log("教学");
}
};
obj.name | obj.teach()
// 2.构造函数
function Person(name){ // 类似于python中的类一样来使用
// this代表Person构造函数实例化出的所有具体对象中的某一个
this.name = name;
this.teach = function(){
console.log(this.name+"正在教育");
}
}
// ①通过构造函数实例化出具体对象
// ②通过对象,语法调用的属性与方法
var p1 = new Person("张三");
p1.name // 张三,this指向p1对象
var p2 = new Person("李四");
p2.teache // 李四正在教学,this指向p2对象
// 3.ES6类语法
class Student{
// 需要构造器(构造函数)来完成对象声明与初始化
constructor(name){
// 属性在构造器中声明完成初始化
this.name = name;
}
// 类方法
static fn(){
console.log("我是类方法")
}
}
// 类中的普通方法由类的具体实例化对象来调用
// 类中的类方法由类直接调用(这类型的方法大多是功能性方法,不需要对象的存在)
3.js选择器
直接通过id名(不严谨,也不推荐使用)
getElement系列(最严谨)
// id获取:
// getElementById('id名')
// 只能由document来调用 // class获取
// getElementByClassName('class名')
// 可以由document以及所属父级调用 // tag获取
// getElementsByTagName('标签名')
// 可以由document以及所属父级调用 querySelector
// 获取第一个满足要求的目标
//querySelector() // 获取所有满足要求的目标
// querySelectorAll() // 1.参数:就采用的是css选择器语法
// 2.可以由document及父级来调用
// 3.对id检索不严谨
4.事件初识
// js事件: 页面标签在满足某种条件下可以完成指定功能的这种功能,称之为事件
// 某种条件:如鼠标点击标签:点击事件 | 鼠标双击标签:双击事件 | 键盘按下:
键盘按下事件
// 指定功能:就是开发者根据实际需求完整相应的功能实现 // 钩子函数:就是满足某种条件被系统回调的函数(完成指定功能)
// 点击事件:明确激活钩子的条件 = 机会钩子后该处理什么逻辑,完成指定功能(函数) // 获取页面标签是前提
var div = documet.querySelector('.div')
// 钩子条件:双击 = 指定功能(自身背景颜色变红)
div.ondblclick = function(){
this.sytle.backgroundColor = "red";
}
5.js操作页面内容
文本内容
// box.innerText
// 可以设值,也可以取值
标签内容
// box.innerHTML
// 可以设值,也可以取值,能解析html语法代码 // box.outerHTML
// 获取包含自身标签信息的所有子内容信息
样式
// box.style.样式名 ==》可以设值,可以取值,但操作的只能是行间式
// getComputedStyle(box,null). 样式名 ==》只能取值,不能设值,能获取所有方式设值的值(行间式 与 计算后样式) // 注:获取计算后样式,需要关注值得格式
第六十五天 js操作的更多相关文章
- python第六十五天--python操作mysql
pymysql模块对mysql进行 import pymysql # 创建连接 conn = pymysql.connect(host='127.0.0.1', port=3306, user='ro ...
- Gradle 1.12用户指南翻译——第六十五章. Maven 发布(新)
其他章节的翻译请参见:http://blog.csdn.net/column/details/gradle-translation.html翻译项目请关注Github上的地址:https://gith ...
- 孤荷凌寒自学python第六十五天学习mongoDB的基本操作并进行简单封装4
孤荷凌寒自学python第六十五天学习mongoDB的基本操作并进行简单封装4 (完整学习过程屏幕记录视频地址在文末) 今天是学习mongoDB数据库的第十一天. 今天继续学习mongoDB的简单操作 ...
- 《手把手教你》系列技巧篇(六十五)-java+ selenium自动化测试 - cookie -下篇(详细教程)
1.简介 今天这一篇,宏哥主要讲解:利用WebDriver 提供可以读取.添加和删除cookie 信息的相关操作方法.验证浏览器中是否存在某个cookie.原因是:因为基于真实的cookie 的测试是 ...
- Bootstrap入门(二十五)JS插件2:过渡效果
Bootstrap入门(二十五)JS插件2:过渡效果 对于简单的过渡效果,只需将 transition.js 和其它 JS 文件一起引入即可.如果你使用的是编译(或压缩)版的bootstrap.js ...
- 第三百六十五节,Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)的基本查询
第三百六十五节,Python分布式爬虫打造搜索引擎Scrapy精讲—elasticsearch(搜索引擎)的基本查询 1.elasticsearch(搜索引擎)的查询 elasticsearch是功能 ...
- “全栈2019”Java第六十五章:接口与默认方法详解
难度 初级 学习时间 10分钟 适合人群 零基础 开发语言 Java 开发环境 JDK v11 IntelliJ IDEA v2018.3 文章原文链接 "全栈2019"Java第 ...
- OpenCV开发笔记(六十五):红胖子8分钟带你深入了解ORB特征点(图文并茂+浅显易懂+程序源码)
若该文为原创文章,未经允许不得转载原博主博客地址:https://blog.csdn.net/qq21497936原博主博客导航:https://blog.csdn.net/qq21497936/ar ...
- 第六十四天 JS基础操作
一.分支结构 1.if语句 if基础语句 if(条件表达式){ 代码块: } // 当条件表达式结果为true,会执行代码块:反之不执行 // 条件表达式可以为普通表达式 // 0.undefined ...
随机推荐
- Arcgis瓦片--js客户端加载
接上篇博客,下载好arcgis格式的瓦片数据以后,需要用js客户端在前端加载出来.这里介绍两种方案: 1.使用超图iServer将瓦片发布成rest地图服务,或者arcgis地图服务,客户端直接加载 ...
- C++ 文件操作(简易的学籍管理系统)
这是一个简易的学籍管理系统,大一时居然三个人写了一千多行......年少无知啊!欢迎摘果实! 1 #include <iostream> #include <fstream> ...
- .NET性能优化小技巧
.NET 性能优化小技巧 Intro 之前做了短信发送速度的提升,在大师的指导下,发送短信的速度有了极大的提升,学到了一些提升 .NET 性能的一些小技巧 HttpClient 优化 关于使用 Htt ...
- Redis可视化工具 Redis Desktop Manager
1.前言 从接触Redis也有两年,平时就使用它来做缓存层,它给我的印象就是很强大,内置的数据结构很齐全,加上Redis5.0的到来,新增了很多特色功能.而Redis5.0最大的新特性就是多出了一个数 ...
- 让 Windows7 - 64bit 支持 VC++ 6.0 的解决方法(无法启动此程序,因为计算机中丢失 MSVCRTD.dll。尝试重新安装该程序以解决此问题)
源地址:https://www.cnblogs.com/poissonnotes/p/4372136.html 无法启动此程序,因为计算机中丢失 MSVCRTD.dll.尝试重新安装该程序以解决此问题 ...
- centos简单的后台运行
# 忽略输出文件 nohup java FileTest > /dev/null 2>&1 &
- Windows下的Nessus安装与启动
Windows下的Nessus安装与启动 一.安装 在https://www.tenable.com/downloads/nessus下载对应windows版本 双击安装,完成后,访问 https:/ ...
- Eclipse编写代码时设置属于自己的注释
翻看硬盘文件,偶然发现以前存的这么一个小操作,给大家分享一下 1.打开Eclipse,按照以下步骤进行设置: Window -->Preferences->Java->Editor- ...
- 【Linux基础】查看硬件信息-内存和硬盘
1.使用free命令查看内存使用 (1)内存总量大小:查看Mem中的total值3697M free -m total used free shared buffers cached -/+ buf ...
- DeveloperGuide Hive UDF
Creating Custom UDFs First, you need to create a new class that extends UDF, with one or more method ...