zoukankan      html  css  js  c++  java
  • JavaScricp(总回顾)

    知识点导图

    1:基础知识

    (1)JavaScript是脚本语言,弱类型,执行非常非常快

    (2)它与java有什么关系?没有任何关系

    (3)js能做什么事情?1控制浏览器 BOM ,2控制元素 DOM

    (4)js不能做什么事情?不能做文件读取,创建及删除,不能直接访问数据库

    (5)node.js - 开发平台,通过这个平台可以开发常规的web服务端,是一块非常轻量级的运行环境

           Jquery.js - 前端框架

    (6)JS是面向过程的语言,JS有面向对象,但是不是纯粹的面向对象语言

    2:常用对话框

    (1)alert(""):警告对话框,作用是弹出一个警告对话框

    (2)confirm(""):确定对话框,弹出一个带确定和取消按钮的对话框——确定返回true,取消返回false

    (3)primpt("要显示的文字"):可以允许用户输入内容的对话框

    3:数据类型

    (1)基本数据类型:字符串、小数、整数、时间日期、布尔型等

    (2)变量只有一种类型:

        通用类型var,可以随便存储其它类型的值,可以直接使用,不用定义。但习惯上定义。

        定义变量: var a;    //所有变量定义都用var定义,var是通用的可变类型。

        var s = "3.14";

    (3)类型转换

        分为自动转换和强制转换,一般用强制转换。

        其他类型转换为整数:parseInt()

        其他类型转换为小数:parseFloat()

        判断数字是否合法:isNaN()

    4:运算符(与C#一样)

        数学运算符:+    -    *    /    %    ++    --;

        关系运算符:==    !=    >=    <=    >    <;

        逻辑运算符:&&    ||    !;

        其他运算符:+=    -=    *=    /=    %=    ?:;

    5:语句

        一般分为顺序、分支和循环语句。

        (1)分支语句:  if{}else{}   if{}else{}  

        (2)循环for语句for(初始条件:循环条件;状态改变){循环体}

        (3)问题类型:穷举,迭代

        (4)关键词:break、continue

        (5)如果输出某一参数的值:输出的值是“+a+”和“+b

    6:数组

         数组的定义:new Array();    //它的长度是动态变化的,里面可以放任意类型的元素。

        数组元素的赋值:a[0]=123; a[1]="hello";  //元素中的索引从0开始。

        数组的取值:a[i];

        数组属性:a.length;    //数组元素的个数,长度。没有count()

        方法:a.sort(); //数组排序,按照每一个元素的第一个字符进行排序。

                a.reverse();  //翻转数组。

    7:函数

        函数的四要素:名称、输入、返回值、加工。

        定义函数:function add(形参){函数体}     //函数名为add,输入为参数的形式,返回值可以是var类型,也可以return一个返回值。

        匿名函数:function(){函数体}

        函数必须经过调用才能执行。函数的调用:add(实参)

    BOM(主要记忆)

    window.open("打开的地址","打开的位置")

    window.opener:打开此页面的上一个页面对象

    window.close():关闭当前页面

    window.scrollTo(x,y)滚动页面至哪里,y代表纵向滚动;

    window.history.back();页面进行后退;

    location地址栏:window.location.href="http://www.baidu.com";修改页面地址,会跳转页面(超链接)

    DOM(主要记忆)

    (1)找到元素

         按照ID来找 var aa = document.getElementById("id");找到的肯定是一个对象

          按照Class来找 var aa = document.getElementsByClassName("class");找到的肯定是一个数组

          按照Name来找 var aa = document.getElementsByName("name");找到的肯定是一个数组

          按照元素名来找 var aa = document.getElementsByTagName("div");找到的肯定是一个数组

    (2)操作元素内容

         innerHtml - 会将元素标记代码渲染后的效果显示出来(超链接形式显示):会将所有的内容和代码一并取出来

          innerText - 不会让内容进行任何渲染,写的什么直接就输出什么(把超链接代码显示出来了):取值时它只会把能看到的文字信息取出来,不会取到HTML代码

          value - 12个表单元素御用,别的元素没有权利使用它们并不是value就能解决全部表单元素的内容操作,部分元素还需要上面两种的配合。如:option,radio

    (3)操作元素属性

         1、添加属性

          oTxt1.setAttribute("readonly", "readonly");

          2、修改属性
         oTxt1.setAttribute("Class", "ttt");


         ( 添加、修改)如果没有此属性会添加进去,相反,会修改此属性的值

          3、查询属性
          this.getAttribute("Class");

          获取属性的值

          4、删除属性
          this.removeAttribute("Class");

          移除一个属性

    (4)操作元素样式所有的样式操作都是在元素代码内部进行添加及更改,优先级最高

         1、 添加样式

                this.style.width="100px";
                this.style.boxShadow = "0px 0px 15px black";

          2、修改样式
               this.style.width="100px";
               this.style.boxShadow = "0px 0px 15px black";

          3、查询当前样式
               this.style.xxx - 只能获取写在元素代码内部的样式值

               获取即使样式:
                       this.offsetWidth
                       this.offsetHeight
                       this.offsetTop
                       this.offsetLeft

          4、删除样式

    (5)操作元素

         1、查找兄弟级的上一个和下一个

          this.nextSibling
          this.previousSibling

         2、查找父级元素
         this.parentNode

         3、查找全部子级元素
         this.childNodes

         4、创建新元素
         var oDiv = document.createElement("div");

         document.getElementById("boss").appendChild(oDiv);
         ---------------------------------------------------

         var oDiv = "<div class='div1'></div>";

         document.getElementById("boss").innerHTML += oDiv;
        ----------------------------------------------------

         5、移除元素
         this.remove();

  • 相关阅读:
    C if语句判断年龄
    C 计算时间差
    C 计算身高
    JRebel激活破解完美解决方式
    Maven optional和scope
    判断当前时间是否在某个时间段内
    给定时间加上几个小时
    RabbitMQ学习笔记
    浏览器、服务器会话
    Maven核心知识点梳理
  • 原文地址:https://www.cnblogs.com/jiuban2391/p/6270814.html
Copyright © 2011-2022 走看看