• js学习


    1、js是可以嵌入到html中,是基于对象和事件驱动的脚本语言

    特点:(1)交互性

               (2)安全性:js不能访问本地磁盘

                (3)跨平台:浏览器中都具备js解析器

    2、(1)js能动态的修改html和css的代码

         (2)能动态的校验数据

          网景公司 LiveScript  微软 JScript   ECMAScript   JavaScript

    3、js被引入的方式

          (1)内嵌脚本

          (2)内部脚本

           (3)外部脚本

    在不影响功能前提下,js越晚加载越好

    js基本语法:

    变量   var  弱类型语言

    原始数据类型

    (1)number:数字类型

    (2)string:字符串类型

    (3)boolean:布尔类型

     (4)null:空类型 object类型

      (5)undefined:未定义类型

       注意:number、boolean、string是伪对象

    typeof 检验类型

    类型转换:

         numberoolean转换为string:通过toString()

         stringoolean转换为number:

       parseInt()

       parseFloat()  注意没有parseDouble()

       boolean不能转

       string可以将数字字符串转换成number 如果“123a3sd5”,转换成123

     强制转换

       Boolean()  强转成布尔

       数字转布尔,非零就是true,零就是false

    字符串转布尔    非“”(空字符串)就是true,空字符串就是false

       Number()强转为数字

      布尔转数字  true转成1  false转成0

     字符串转数字 不能强转

    引用数据类型

    java:Object obj = new Object();

    js:var obj = new Object();

          var num = new Number();

    运算符

    (1)赋值运算符

     (2)算数运算符

           +:遇到字符串就变成连接了

           -:先把字符串转换为数字然后进行运算

          *和/与-一样,都是先把字符串转换为数字然后再进行运算

       1213/100*100 = 1213;     //特别注意js中才是这样的

     (3)逻辑运算符

    只有&& || ,没有& |

     (4)比较运算符

       ===全等:类型与值都要相等

     (5)三元运算符

     (6)void运算符

      <a href="javascript:void(0);">xxx</a>  a标签不跳转

     (7)类型运算符

       typeof:判断数据类型  返回我的数据类型

       instanceof:判断数据类型  是否是某种类型

    逻辑语句

      var arr = [1,3,5,7,9];

       for index in arr

    js对象

     Number

       var numer= new Number(s)

       var numer= Number(s)

       toString():转成字符串

        valueOf():返回Number对象的基本数值

    Boolean

       var bool= new Boolean(s)

       var bool= Boolean(s)

    String

       var str = new String(s)

       var str = String(s)

    属性和方法:

       length:字符串的长度

      charAt():返回索引字符

      charCodeAt():返回索引字符unicode

      indexOf():返回字符的索引

      split():将字符按照特殊字符切割为数组

      substr():从起始索引号提取指定数目的字符串

      substring():提取两个指定索引号之间的字符

      toUpperCase():转大写

    (4)Array

         var arr= new Array()

          var arr=new Array(size)  超出长度后自动扩展

          var arr= new Array(element0, element1, element2, ..., elementn)

          var arr = [];

          var arr = [1,2,3];

           var arr=[5]   在js中是没有的

        length

        join()

       pop()

       push()

       reverse()

       sort()   按照字符串字典顺序进行排序

    Date

       创建方式:

        var myDate = new Date()

        var myDate = new Date(毫秒值)  //代表从190-1-1起到的毫秒

         getFullYear():年

         getMonth():月 0-11

        getDay():星期 0-6

       getTime():

       toLocal String():获得本地时间格式

      Math

      RegExp

      创建方式:

       var reg = new RegExp(pattern)

       var reg = /^正则规则$/

      规则的写法:

      [0-9]  d  代表数据   D 非数字

      [A-Z]

      [a-z]

      [A-z]

      w  查找单词字符

      W 查找非单词字符

      s  查找空白字符

      S 查找非空白字符

    + 出现至少一次

    * 出现0次或多次

    ?出现0次或1次

    {5} 出现5次

    {2,8} 2到8次

    方法:

         test():检索字符串中指定的值,返回true或false

     js函数定义的方式

    (1)普通方式

            语法:function 函数名(参数列表){函数体}

    (2)匿名函数

           语法:function(参数列表){函数体}

            var method = function(){

                         alert("yyy");

             };

    (3)对象函数

         语法:new Function(参数列表,函数体);

         注意:参数名称必须使用字符串形式、最后一个默认是函数体,且函数体需要字符串形式

      var fn = new Function("a","b","alert(a+b)");

    2、函数的参数

      (1)形参没有var修饰

    (2)形参和实参个数不一定相等

      (3)arguments是个数组,会将传递的实参进行封装

    3、返回值

     (1)在定义函数的时候不必标明是否具有返回值

      (2)返回值仅仅通过return返回就可以了,return后的代码不执行

    4、js的全局函数

    (1)编码和解码

      decodeURI()  解码某个编码的URI

      encodeURI()  把字符串编码为URI

      decodeURIComponent() 解码一个编码的URI组件

      encodeURIComponent() 解码一个编码的URI组件

      escape() 对字符串进行编码

      unescape() 对由escape()编码的字符串进行解码

    三者区别:

      进行编码的符号范围不同,实际开发中常使用第一种。

    (2)强制转换

         Number()

         String()

         Boolean()

     (3) 转成数字

         parseInt()

          parseFloat()

      (4)eval()方法

          将字符串当作脚本进行解析运行

    js的事件

      事件  

    事件源

    响应行为

    js的常用事件:

    onclick:点击事件

     onblur: 元素失去焦点 

    onfocus:元素获取焦点

     onchange用户改变域的内容

      ondblclick  onfocus onkeyup  onload onmouseover  onreset  onsubmit  onunload onmouseout

    事件的绑定方式:

    (1)将事件和响应行为都内嵌到html标签中

    (2)将事件内嵌到html中,而响应行为用函数进行封装 

    (3)将事件和响应行为与html标签完全分离

    this关键字

    this经过事件的函数进行传递的是html标签对象

    <label for="value">
    for 属性规定 label 与哪个表单元素绑定
    js代码中要用document,必须将它添加到后面,不要放到前面

    onmouseover:鼠标悬浮的事件
    onmouseout:鼠标离开的事件
    css的background-color写到JavaScript代码中要用驼峰命名,backgroundColor
    onload事件
    window.onload=function(){};等页面加载完毕再执行此事件
    3、阻止事件的默认行为
    IE:window.event.returnValue = false; //阻止默认的事件
    W3c(火狐谷歌):传递过来的事件对象.preventDefault();
    通过事件返回false也可以阻止事件默认行为
    4、阻止事件的传播
    IE:window.event.cancelBubble = true;
    W3c:传递过来的事件对象.stopPropagation();
    if(e&&e.stopPropagation) 调用传入参数event
    {
    e.stopPropagation();
    }else
    {
          window.event.cancelBubble = true;js的bom
    (1)window对象
    弹框的方法
    提示框:alert("提示信息");
    确认框: confirm("确认信息");
    输入框:prompt("请输入密码");返回值就是输入的值
    open方法
    window.open("url地址");
    定时器:
    setTimeout(function,毫秒值);在某个毫秒值后执行函数
    clearTimeout(定时器名称);
    setInterval(function,毫秒值);
    clearInterval(定时器名称);
    (2)location
    location.href="url地址";
    (3)history
    back() 上一页
    forward() 下一页
    go()跳转到哪一页
    js的dom
    1、理解一下文档对象模型
    html文件加载到内存之后会形成一颗dom树,根据这些节点对象可以进行脚本代码的动态修改。
    在dom树种,一切皆为节点对象。
    2、dom方法和属性
    查找元素节点
    getElementById()
    getElementsByName()
    getElementsByTagName()
    查看是否存在子节点
    hasChildNodes()
    元素节点、文本节点、属性节点,每个节点都有nodeName、nodeType 只读属性
    Node.ELEMENT_NODE ---1  元素节点
    Node.ATTRIBUTE_NAME ---2 属性节点
    Node.TEXT_NODE ---3 文本节点
    nodeValue,返回给定节点的值 元素节点返回值是null 可读可写
    <p id="pid">wenben</p>
    var textNode = document.getElementById("pid").firstChild;
    var p = node.getAttributeNode("id"); 根据属性来获得属性节点,不能写属性值
    firstChild/lastChild
    childNodes表示父节点下所有的子元素(数组)
    替换节点
    replaceChild()
    element.replaceChild(newchild,oldchild)
    获取父节点 parentNode
    查找属性值
    getAttribute(attributeName)
    setAttribute(
    attributeName,attributeValue)
    createElement()
    createTextNode()
    appendChild()
    插入节点
    insertBefore()
    element.insertBefore(newNode,targetNode)
    DOM没有提供insertAfter()方法
    nextSibling 下一个兄弟
    removeChild()删除
    innerHTML
    Ajax
    function
    getXMLHttpRequest(){
    var xmlhttp;
    if (window.XMLHttpRequest)
    {
    xmlhttp = new XMLHttpRequest();
    }else
    {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return xmlhttp;
    }
    window.onload = function()
    {
    var req = getXMLHttpRequest();
    req.onreadystatechange = function()
    {
    if(req.readyStae == 4)
    {
    if (req.status == 200)
    {
    alert(req.responseText);
    }
    }
    }
    req.open("get","${pageContext.requset.contextPath}/servlet/servletDemo1");
    req.send(null);
    }
    onblur 事件会在对象失去焦点时发生
  • 相关阅读:
    min_25筛入门
    [湖南集训]更为厉害/谈笑风生
    [ARC060D] 最良表現
    [CQOI2007]矩形
    [SCOI2009]粉刷匠
    PAT乙级1030
    PAT乙级1028
    PAT乙级1029
    PAT乙级1026
    PAT乙级1027
  • 原文地址:https://www.cnblogs.com/bluecloudwyy/p/9498258.html
Copyright © 2020-2023  润新知