数据类型转换,JS操作HTML

数据类型转换

1.自动转换(在某种运算环境下)

• Number环境
• String环境
• Boolean环境

2.强制类型转换

• Number()

• 字符串:纯数字和空字符转为正常数字,其他NaN

• 布尔值:ture=1,false=0

  var str = "abc"
  console.log(typeof(str));
  var num = Number(str);
  console.log(num);
  console.log(typeof(num));
  console.log("")
  /* 最终输出
  string
  NaN
  number*/

• String()

• 原样输出

  var num=108.1;
  console.log(typeof(num));
  var str=String(num);
  console.log(str);
  console.log(typeof(str));
  console.log("")
  /浏览器最终输出
  number
  108.1
  string/

• Boolean()

• 转化为false:数字0,空字符串,null和underfined

• 转化为true:值表示有东西

  var v=100;
  console.log(typeof(v));
  var b=Boolean(v);
  console.log(b);
  console.log(typeof(b));
  console.log("");
  // number
  // true
  // boolean
  //

• parseInt()

• 转化为整数

• 与Number的区别:一数字开头的字符串,不会转化为NaN

  var v="abc123";
  console.log(typeof(v));
  var n=parseInt(v);
  console.log(n);
  console.log(typeof(n));
  console.log("");
  /*string
  NaN
  number
  */

• parseFloat()

• 转换为小数或整数

• 与Number的区别:一数字开头的字符串,不会转换为NaN

  var v="123.14abc";
  console.log(typeof(v));
  var n=parseFloat(v);
  console.log(n);
  console.log(typeof(n));
  console.log("")
  /*string
  123.14
  number
  */

JS操作 HTML

1.事件

• onclick

2.函数

• 声明函数

  function 函数名(){
  代码;
  }

• 调用函数

  函数名()

3.获取元素

• document.getElementById(" ")
• js代码写在html元素里面

JS操作html元素的属性以及css数据

• 元素对象.属性名

• 元素对象.style.属性名

• css属性名用小驼峰命名法.只有写在元素style中的css属性,才可以被获取

• innerHTML属性 获取或设置双标签内的内容

  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  加数1
  加数2
  	加

  
  
  

表达式

• 简单表达式:变量,直接量
• 复杂表达式:运算符与简单表达式的组合
• 函数调用表达式

运算符

1.算术运算符

• 加号运算符 +
• 减号运算符 -
• 乘号运算符 *
• 除号运算符 /
• 取余运算符(取模) %
• 负数运算符 -
• 整数运算 +
• 递增运算符 ++
• 递减运算符 --

2.比较运算符

• 相等运算符 ==
• 不等运算符 !=
• 全等运算符 ===
• 不全等运算符 !==
• 小于运算符 <
• 小于等于运算符 <=
• 大于运算符 >
• 大于等于运算符 >=
• in运算符

3.位运算符

• 按位与 &
• 按位或 |
• 按位非 ~
• 按位异或 ^
• 左移
• 右移

4.赋值运算符

• =
• +=
• -=
• *=
• /=
• %=

5.其他运算符

• 字符串连接符 +
• ,运算符
• typeof 运算符
• 比较运算符 表达式 ? 表达式1 : 表达式2