• JavaScript(复习总结)


    一、三个常用对话框

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

    2、confirm(""):确定对话框,弹出一个带确定和取消按钮的对话框——确定返回true,取消返回false,可用变量来接收。

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

    二、JavaScript基本语法

    1、变量

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

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

        

    2、类型转换

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

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

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

    3、运算符

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

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

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

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

    4、语句

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

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

        (2)循环for语句

    5、数组(类型固定,长度不固定)

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

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

        数组的取值:a[i];

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

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

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

    6、函数

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

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

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

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

    三、Windows对象操作

    (一)部分

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

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

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

    4、window.navigate("url") 跳转至目标页面(超链接),在谷歌浏览器下有bug;(不常用)

    5、window.moveTo(x,y) 移动页面至某一位置,位置由x和y决定;(不常用)

    6、window.resizeTo(宽,高) 调整页面的宽度和高度;(不常用)

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

    (二)Window.history对象

    1、window.history.back();页面进行后退;——主要记住

    2、window.history.forward();页面前进;

    3、window.history.go(n); n如果是正数则代表前进n个页面,n如果是负数则代表后退n个页面,一般常用这一种。 

    (三)Window.location对象

    location地址栏

    window.location.href="http://www.baidu.com";修改页面地址,会跳转页面(超链接)——主要记住(优先使用做超链接)

    四、Windows对象——window.document对象

    它可以将Html中的元素提取到js里面,然后对它进行各种各样的操作

    它是js中的核心中的核心

    (一)取元素

          1、docunment.getElementById("id");根据id找,最多找一个;

          2、docunment.getElementsByClassName("name") 根据classname找,找出来的是数组;

          3、docunment.getElementsByName("name");根据name找,找出来的是数组;

          4、docunment.getElementsByTagName("name");根据标签名找,找出来的是数组;

    注:根据id和classname最好用

    (二)操作内容

    1、普通元素

    取值:alert(a.innerHTML)——会将元素内的所有内容,包括元素标记都取出来

            alert(a.innerText)——只取里面的文字,忽略所有被编译元素

    赋值a.innerHTML = "<font color=red >hello world </font>"——如果内容有元素,编译后实现

             a.innerText——会将赋的东西原样呈现

    2、变单元素

    取值var t = document.f1.t1——form表单ID为f1里面的ID为t1的input;     

             var t = document.getElementById("id")—— 直接用ID获取。

             alert(t.value)——获取input中的value值;

    赋值 t.value="内容改变";

    注:所有表单元素取值赋值都用value

    (二)操作属性

    1、添加、修改属性

            对象.setAttribute("属性名","属性值")——如果没有此属性会添加进去,相反,会修改此属性的值

    2、获取属性:

            对象.getAttribute("属性名")——获取属性的值;

    3、删除属性

            对象.removeAttribute("属性名")——移除一个属性。

    (三)操作样式

    1、添加、修改样式

            对象.style.样式名称=值
    2、获取样式

            var  ....=对象.style.样式名称  

    (四)相关元素操作——写通用特效用

    var a = document.getElementById("id");找到a;

    var b = a.nextSibling——找a的下一个同辈元素,注意包含空格;

    var b = a.previousSibling——找a的上一个同辈元素,注意包含空格;

    var b = a.parentNode——找a的上一级父级元素;

    var b = a.childNodes——找出来的是数组,找a的下一级子元素;

    var b = a.firstChild——第一个子元素,lastChild最后一个,childNodes[n]找第几个;

    alert(nodes[i] instanceof Text);——判断是不是文本,是返回true,不是返回flase,用if判断它的值是不是false,可以去除空格。

     注意:回车和空格都算作一个元素

    五、事件

    1、onclick:鼠标单击触发

         ondblclick:双击触发

    2、onmouseover:鼠标移动上面触发

         onmouseout:鼠标离开时触发

    3、onblur:失去焦点时触发

         onfocus:获得焦点是触发

    4、onkeyup:按键抬起来的时候触发

    补:1、获得某个元素的当前高度、宽度......   ——offsetheight、offsetwidth、offset什么.......

          2、浏览器尺寸改变触发的事件:window.onresize

  • 相关阅读:
    CMLLVDS
    js获取url中的参数(解决中文乱码)
    解决跳转出现 No input file specified.
    ThinkPHP关联模型详解
    Thinkphp表单自动验证
    手机号登录注册
    JS实现每隔一段时间数量增加或减少
    文章或者观点说说等点赞功能实现(thinkphp)
    thinkphp整合Ueditor编辑器
    点击切换状态 类似开关按钮
  • 原文地址:https://www.cnblogs.com/yp11/p/5911098.html
Copyright © 2020-2023  润新知