JS-第一节课程

一、JavaScript（JS）定义：

• JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言。

• JavaScript通常用来操作HTML页面，响应用户操作，验证传输数据等。

• jQuery和JavaScript有什么关系？jQuery是由JS编写的一个js库。

组成：

ECMAScript，描述了该语言的语法和基本对象。

文档对象模型（DOM），描述处理网页内容的方法和接口。

浏览器对象模型（BOM），描述与浏览器进行交互的方法和接口。 

 

 

 

二、JS代码写在哪里？

1 JavaScript代码可以写在页面的

• 内嵌 js，
• 外链 js文件里面，利用src属性引入

• 标签属性里面（不推荐）；

  1. script标签中的属性type="text/javascript"或language=”javascript”，HTML5新规则下可以什么都不用加；

  2. script标签可以放置于任何位置，不同的位置要注意加载顺序，通常放在head或body结束之前；

三、 写JS代码需要注意什么

1、严格区分大小写；

2、语句字符都是半角字符；（字符串里面可以使任意字符）

3、某些完整语句后面要写分号 (;)；

4、代码要缩进，缩进要对齐。

四、 JS调试

五、变量

当我们重复使用某个元素或者某个数据时，内容可能太长或者数据要进行改变，这时就需要定义变量来代替他们。

语法：`var` + `变量名`

• var 声明
• 变量命名规则：

可以使用`$` , `_` ,`字母`， `数字`，[ 不能以数字开头 ] ,[字母严格区分大小写], [见名知意]

1.var abc; //申明不赋值
2.var obj = 123;//申明立即赋值

一个var可以声明多个变量，变量不一定要马上赋值

1. var a,b,c,d;//一次声明多个变量
2. var a = 1,b = 2, c = 3,d = 4;//一次声明多个申明即赋值的变量

六 、Js中的注释

• 单行 //
• 多行 /* */

七、获取元素

1. 获取元素 
   
   • 特殊的标签 
     
     • document.body
     • document.head
     • document.title
   • 一般标签 
     
     • document.getElementById() 匹配ID名称…
     • ele.getElementsByTagName() 匹配标签名是…的集合动态方法         //类数组　　多个
     • document.getElementsByName() 匹配name是…的集合 动态方法        //类数组　　多个       
     • ele.getElementsByClassName() 匹配class名称…的集合 动态方法          //类数组　　多个
     • ele.querySelector(); 匹配css选择器的第一个
     • ele.querySelectorAll(); 匹配css选择器匹配的所有集合 
       . 及[]的运用

八、获取和修改元素HTML

• 元素HTML内容 
  ele.innerHTML 获取元素HTML 
  ele.innerHTML = ‘字符串’; 修改元素HTML

  • 套路：“用于修改元素的HTML内容(innerHTML)的JS代码，被修改元素必须在JS代码之前”；

• 元素文本内容 
  标准 
  ele.textContent 获取元素文本 
  ele.textContent = ‘字符串’; 修改元素文本 
  非标准(ie低版本) 
  ele.innerText 获取元素文本 
  ele.innerText = ‘字符串’; 修改元素文本