Html 结构化
CSS 样式
JavaScript 行为交互
01.JavaScript基础
02.JavaScript操作BOM对象
03.JavaScript操作DOM对象 *****
04.JavaScript的面向对象
--------------------------------------
05.jQuery (js) .css .js
06.jQuery选择器 ******
07.jQuery事件和动画
08.jQuery操作DOM对象 ******
09.表单验证
10.表单验证的框架 jquery validate
11.bootstrap 封装了Html css js

JavaScript基础 (liveScript)
01.和java的关系,只是借势!
02.是一个脚本语言,以.js结尾
03.浏览器编译JavaScript,解析器我们称之为JavaScript引擎!
04.无需预编译 *****
js是一种弱语言类型 var a=10; var a="101"; var a=new Date();
05.运行在客户端 ***** 减轻服务器的压力

目的:
01.提升用户的体验
02.减轻服务器的压力

组成部分:
01.ECMAScript规定了js的基本语法和基本对象
02.BOM(浏览器对象模型) 提供了处理网页内容的方法和接口
03.DOM(文档对象模型) 提供了与浏览器进行交互的方法和接口

我们一个页面中可以引入css文件还可以引入js文件?
有没有顺序呢?

01.css写在head中
02.js文件的引入写在body的最下方

js的引入方式:
01.行内引入
02.内部引入
03.外部引入

js中的常用事件

01.不想让a超链接 立即跳转至指定的页面
02.想让用户点击的时候 做一些处理工作
javascript: 伪协议
01.先去执行js代码
02.根据js代码做操作
alert('就是不跳转') 后续会换成某个操作的函数(方法)

<a href="javascript:alert('就是不跳转')">跳转</a>

伪协议 javascript:
onclick 点击事件
onblur 失去焦点事件
onfocus 获取焦点事件

js数据类型

undefined: 声明但是没有赋予初始值!没有被定义的变量!
var name;
alert(name); //什么都没有
alert(typeof(name)); //undefined

number: 包含了整数和浮点数
typeof(20)
typeof(20.2)

string : 被单引号和双引号括起来的内容都是字符串
typeof('20')
typeof('20.2')

boolean: true 和 false
alert(typeof(TRUE)); //把TRUE 当成一个变量名
alert(typeof(true)); //√
alert(typeof("true")); //string

object: js中的对象,包含数组, null和对象!

null:空值,表示对象不存在,等于undefined!

typeof 检测变量的数据类型
01. typeof 空格变量名称
02. typeof(变量名称) *****

类型转换
parseInt(): 变量值可以不是一个数字,返回第一个不为数字的所有值,
返回一个整数!
 否则返回NaN(not a number)
parseFloat():返回一个浮点数!

强制类型转换

number():把变量整体当作转换的值,如果有一个字符不是数值,则返回NaN!

boolean():只要变量不是false,0,undefined,null,NaN,未定义的参数或者定义未赋值
空串,或者什么都没有输入! 其他都返回true!

== 和 ===

== :在两个变量比较的时候,先进行类型转换,之后再比较!
alert("0"==false);
首先会把字符串"0"转换成number 0
false转换成number 0
0==0

===:比较严格,先比较两个变量的类型是否一致,之后再比较值!不会类型转换!

注意点:
01.如果比较的变量中boolean的值,会先把boolean类型的值转换成number类型!
02.如果比较的变量中String的值,会先把String类型的值转换成number类型!

输入和确认
alert(): 只有一个确定按钮!
confirm ():是一个提示框,有确定和取消按钮!
用户点击确定返回值是true
用户点击取消返回值是false

prompt():是一个对话框!
01.第一参数是提示语句
02.第二参数是输入框中的默认值,可以省略
返回值是我们第二个参数(用户的输入)!

js中也有选择结构!和java中的用法一致!

数组

var arr1=new Array(); //没有长度
var arr1=new Array(5); //有长度5
var arr1=new Array(1,2,3,4,5) //定义数组的同时赋值
var arr1=[1,2,3];

向数组中新增元素 push
把数组中的每个元素使用指定的分隔符连接起来,变成字符串! join

循环 for in

for(var index in arrs){
document.write(arrs[index])
}
index 是元素的下标!

函数

定义函数的两种方式
<a href="javascript:sayHello('小黑');">跳转</a>

function sayHello(userName){
alert(userName+"辛苦了!");
}

var sayHello=function(userName){
alert(userName+"辛苦了!");
}

js上课笔记的更多相关文章

  1. js学习笔记:webpack基础入门(一)

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  2. Vue.js学习笔记(2)vue-router

    vue中vue-router的使用:

  3. js读书笔记

    js读书笔记 基本类型的基本函数总结 1. Boolean() 数据类型 转换为true的值 转换为false的值 Boolean true false String 任何非空字符串 "&q ...

  4. React.js入门笔记

    # React.js入门笔记 核心提示 这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

  5. JS 学习笔记--9---变量-作用域-内存相关

    JS 中变量和其它语言中变量最大的区别就是,JS 是松散型语言,决定了它只是在某一个特定时间保存某一特定的值的一个名字而已.由于在定义变量的时候不需要显示规定必须保存某种类型的值,故变量的值以及保存的 ...

  6. 面向对象程序设计-C++ Stream & Template & Exception【第十五次上课笔记】

    这是本门<面向对象程序设计>课最后一次上课,刚好上完了这本<Thinking in C++> :) 这节课首先讲了流 Stream 的概念 平时我们主要用的是(1)在屏幕上输入 ...

  7. node.js系列笔记之node.js初识《一》

    node.js系列笔记之node.js初识<一> 一:环境说明 1.1 Linux系统CentOS 5.8 1.2 nodejs v0.10.15 1.3 nodejs源码下载地址 htt ...

  8. JS面向对象笔记二

    菜单导航,<JS面向对象笔记一>,  参考书籍:阮一峰之<JavaScript标准参考教程> 一.构造函数和new命令 二.this关键字 三.构造函数和new命令 四.构造函 ...

  9. WebGL three.js学习笔记 使用粒子系统模拟时空隧道(虫洞)

    WebGL three.js学习笔记 使用粒子系统模拟时空隧道 本例的运行结果如图: 时空隧道demo演示 Demo地址:https://nsytsqdtn.github.io/demo/sprite ...

随机推荐

  1. 基于Windows,Python,Theano的深度学习框架Keras的配置

    1.安装Anaconda 面向科学计算的Python IDE--Anaconda 2.打开Anaconda Prompt 3.安装gcc环境 (1)conda update conda (2)cond ...

  2. Linux中执行C++程序

    参考:https://blog.csdn.net/qq_31125955/article/details/79343498 https://blog.csdn.net/weixin_35477207/ ...

  3. C++ 在类里面使用多线程技术

    参考链接:   https://blog.csdn.net/jmh1996/article/details/72235232 说明:    C++的每个成员函数都会有一定转化, 而static 则不会 ...

  4. TCP/IP(五)传输层之细说TCP的三次握手和四次挥手

    前言 这一篇我将介绍的是大家面试经常被会问到的,三次握手四次挥手的过程.以前我听到这个是什么意思呀?听的我一脸蒙逼,但是学习之后就原来就那么回事! 一.运输层概述 1.1.运输层简介 这一层的功能也挺 ...

  5. [转载]关于在Linux下上传代码至Github

    刚开始使用Github没多长时间,所以很多地方不太熟练,看到阿里云上有一篇文章写得不错,故转载过来. 转载自:https://www.aliyun.com/jiaocheng/122729.html ...

  6. k64 datasheet学习笔记22---Direct Memory Access Controller (eDMA)

    0.前言 本文主要介绍DMA相关内容 1.简介 DMA模块包含: 1.一个DMA引擎 源和目的地址的计算 数据搬移 2.本地存储的传输控制描述TCD,对于16个传输通道中的每一个各对应一个TCD 1. ...

  7. installshield安装包制作

    入门教程:http://blog.csdn.net/gaofang2009/article/details/5260065 入门教程:http://blog.csdn.net/plfl520/arti ...

  8. 【原创】Java基础之ClassLoader类加载器简介

    classloader简介 1 classloader层次结构(父子关系) Bootstrap(ClassLoader) ExtClassLoader AppClassLoader XXXClassL ...

  9. Java_日期时间相关类

    目录 Date类(java.util.date) Calendar类(java.util.Calendar) SimpleDateFormat类(java.text.SimpleDateFormat) ...

  10. 利用web.py快速搭建网页helloworld

    访问web.py官网 http://webpy.org/ 根据网站步骤,利用 pip install web.py 若没有 PIP 则先安装pip 运行 sudo apt-get install py ...