JS基础、函数、对象、操作DOM对象

JavaScript基础
    
    JS 脚本语言
        JavaScript 是世界上最流行的编程语言之一,编程语言是用于控制计算机的一系列指令,它有固定的格式和词汇(不同的编程语言固定的格式和词汇是不同的),必须要遵守。
    JavaScript中的变量
        变量就是一个装东西的盒子,通俗的来说,变量就是存放数据的容器。我们通过变量名获取数据,甚至可以修改数据
    JavaScript数据类型
    JS书写位置
        行内
        内嵌
        外部
    JavaScript分支语句
        由上到下执行代码的过程中,根据不同的条件,执行不同的路径代码(执行代码多选一的过程),从而得到不同的结果
        分支结构
        分支语句分类
if
if…else
switch
    JavaScript循环语句
        循环语句的作用是反复地执行同一段代码,只要给定的条件能得到满足,包括在循环条件语句里面的代码就会重复执行下去,一旦条件不再满足则终止。
        循环结构
        循环语句分类
for
while
do…while

JS的函数和对象


    函数
        封装了一段可以被重复调用或者执行的代码块,通过这个代码块可以实现大量代码的重复使用,这就叫做函数。
        创建函数1
            function 函数名([参数列表]) {
    //函数体代码
}
function 是声明函数的关键字,必须小写
由于函数一般是为了实现某个功能才定义的, 所以通常我们将函数名命名为动词,比如 getSum
                function getSum(){
      return 1+2
   }

        创建函数2
            var 函数名 = function ([参数列表]) {
    //函数体代码
}
因为函数没有名字,所以也被称为匿名函数
这个变量名里面存储的是一个函数  
函数表达式方式原理跟声明变量方式是一致的
                 var getSum = function([a,b]){
      return a+b;
   }

        函数调用
            函数名([参数列表])
getSum()    getSum(a,b)
    对象
        JavaScript 对象是拥有属性和方法的数据。

            属性:事物的特征
方法:事物的行为
        创建对象的方法1
            使用字面量创建对象:
var star = {
属性1:属性值1,
属性2:属性值2,
属性3:属性值3
方法1:函数1;
}
                var dog = {
uname:’可乐’,
age:2,
color:yellow,
eat:function(){alert(“吃狗粮”)}
   }

        创建对象的方法2
            利用 new Object 创建对象:
var star = new Object();
star.属性1=“属性1”;
star.属性2=“属性2”;
star.属性3=“属性3”;
star.方法1=函数1
                var dog = new Object();
dog.uname = ’可乐’,
dog. age = 2,
dog. color = yellow,
dog.eat=function(){alert(“狗粮”)}
        创建对象的方法3
            利用构造函数创建对象:
function 构造函数名([形参1,形参2,形参3]) {
     this.属性名1 = 参数1;
     this.属性名2 = 参数2;
     this.属性名3 = 参数3;
     this.方法名 = 函数体;
}
var obj=new 构造函数名([实参1,实参2,实参3])
        访问对象的属性和方法
            1.访问属性:
对象.属性名
对象[“属性名”]

            2.访问方法:
对象.方法名()

JS操作DOM对象


    JS操作DOM对象
     DOM ( Document Object Model ),叫做文档对象模型,DOM可以以一种独立于平台和语言的方式访问和修改html文档的内容和结构。
 

DOM节点分类
    文档节点==>document
元素节点==>标签
属性节点==>标签的属性
文本节点==>标签体

DOM的作用
    通过可编程的对象模型
JavaScript 能够创建动态的 HTML节点
JavaScript 能够改变页面中的所有 HTML 元素
JavaScript 能够改变页面中的所有 HTML 属性
JavaScript 能够改变页面中的所有 CSS 样式
JavaScript 能够对页面中的所有事件做出反应

DOM查询元素方法

方法   说明
getElementById() 通过id查找HTML元素
getElementsByClassName通过类名查找HTML元素
getElementsByTagName() 通过标签名查找HTML元素
querySelector通过选择器获取第一个对象
body 获取body元素
querySelectorAll根据css路径获取元素

                

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值