zoukankan      html  css  js  c++  java
  • WEB 开发前传——js笔记

    知识点

       1. 如何在JS中创建一个数组。如何取整。。

       2.浏览器的内部对象

       3.网页中一些常用的事件

    ......................................

    1

      var mark=new Array();

      mark[1]=75;

      var x=parseInt(mark[1]/10);

    2

      浏览器对象:navigator 属性:appNameappVersionappCodeName

                                  browserLanguagepluginsplatformcookieEnable

      文档对象:docment     属性:linksanchorform

      窗口对象:windows

                           方法:

                                openurlwindowNameparameterlist

                                close()

                                alerttext

                                confirmtext

                                promttextdefaulttext

                                moveBy(水平位移,垂直位移)

                                moveTo(水平位移,垂直位移)

                                forward()

                                home()

                                stop()

                                print()

                                back()

                                status

                                location                            

      位置对象:location   属性:protocolhostnameporthostpathnamehashsearchhref

      历史对象:history    history.go(0) 刷新本页面

    3

      选中事件:onselect

      失去焦点事件:onblur

      获得焦点事件:onfocus

      载入文件事件:onload 

      卸载文件事件:onunload

      鼠标覆盖事件:onmouseover

      鼠标离开事件:onmouseout

    知识点

     1 通过id获取iframe框架容器里面的控件 

      frames['mainframe'].document.getElementById('listtab'));" 

    。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

      <input name="qx" type="checkbox" value="checkbox" 

          onclick="

          selctedAll(this,

            frames['mainframe'].document.getElementById('listtab'));"/>ȫѡ

    <SCRIPT LANGUAGE="JavaScript">

    <br><!--

    <br>var myDate = new Date();

    <br>    myDate.getYear();      //获取当前年份(2)

    <br>    myDate.getFullYear();  //获取完整的年份(4,1970-????)

    <br>    myDate.getMonth();      //获取当前月份(0-11,0代表1)

    <br>    myDate.getDate();      //获取当前日(1-31)

    <br>    myDate.getDay();        //获取当前星期X(0-6,0代表星期天)

    <br>    myDate.getTime();      //获取当前时间(1970.1.1开始的毫秒数)

    <br>    myDate.getHours();      //获取当前小时数(0-23)

    <br>    myDate.getMinutes();    //获取当前分钟数(0-59)

    <br>    myDate.getSeconds();    //获取当前秒数(0-59)

    <br>    myDate.getMilliseconds();  //获取当前毫秒数(0-999)

    <br>    myDate.toLocaleDateString();    //获取当前日期

    <br>    var mytime=myDate.toLocaleTimeString();    //获取当前时间

    <br>    myDate.toLocaleString( );      //获取日期与时间

    <br>if (mytime<"23:30:00")

    <br>{

    <br>alert(mytime);

    <br>}

    <br>//-->

    <br></SCRIPT>

    知识点

     1 文本框内容有效性验证可以调用JS定义的函数checked()

    。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。

    1.  文本框的输入的验证代码:onChange=“某个函数checked();

        获取表单中的数据

          var r= document.form.name.value

          var rr= document.getElementId("").value

    2. 确认框

    确认框用于使用户可以验证或者接受某些信息。

    如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false

    confirm("文本")

    3. 提示框

    提示框经常用于提示用户在进入页面前输入某个值。

    如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null。

    prompt("文本","默认值")

    4. JavaScript For...In 声明

    <script type="text/javascript">

    var x

    var mycars = new Array()

    mycars[0] = "Saab"

    mycars[1] = "Volvo"

    mycars[2] = "BMW"

    for (x in mycars)

    {

    document.write(mycars[x] + "<br />")

    }

    </script>

    5. Throw 声明

    throw 声明的作用是创建 exception(异常)。你可以把这个声明与 try...catch 声明配合使用,以达到控制程序流并产生精确错误消息的目的。

    <script type="text/javascript">

    var x=prompt("Enter a number between 0 and 10:","")

    try

    if(x>10) 

    throw "Err1"

    else if(x<0)

    throw "Err2"

    catch(er)

    {

    if(er=="Err1") 

    alert("Error! The value is too high")

    if(er == "Err2") 

    alert("Error! The value is too low") 

    }

    </script>

    7. document.write("Hello \

    World!")        输出效果:Hello World!

    8. RegExp 对象的方法

    RegExp 对象有 3 个方法:test()、exec() 以及 compile()。

    test()

    test() 方法检索字符串中的指定值。返回值是 true 或 false。

    例子:

    var patt1=new RegExp("e");

    document.write(patt1.test("The best things in life are free")); 

    由于该字符串中存在字母 "e",以上代码的输出将是:

    true

    9. exec()

    exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。

    var patt1=new RegExp("e");

    document.write(patt1.exec("The best things in life are free")); 

    由于该字符串中存在字母 "e",以上代码的输出将是:

    E

    您可以向 RegExp 对象添加第二个参数,以设定检索。

    var patt1=new RegExp("e","g");

    do

    {

    result=patt1.exec("The best things in life are free");

    document.write(result);

    }

    while (result!=null)

    10. compile()

    compile() 方法用于改变 RegExp。compile() 既可以改变检索模式,也可以添加或删除第二个参数。

    var patt1=new RegExp("e");

    document.write(patt1.test("The best things in life are free"));

    patt1.compile("d");

    document.write(patt1.test("The best things in life are free"));

    由于字符串中存在 "e",而没有 "d",以上代码的输出是:

    truefalse

    11. 创建和存储 cookie

    在这个例子中我们要创建一个存储访问者名字的 cookie。当访问者首次访问网站时,他们会被要求填写姓名。名字会存储于 cookie 中。当访问者再次访问网站时,他们就会收到欢迎词。

    function setCookie(c_name,value,expiredays)

    {

    var exdate=new Date()

    exdate.setDate(exdate.getDate()+expiredays)

    document.cookie=c_name+ "=" +escape(value)+

    ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())

    }

    上面这个函数中的参数存有 cookie 的名称、值以及过期天数。

    之后,我们要创建另一个函数来检查是否已设置 cookie:

    function getCookie(c_name)

    {

    if (document.cookie.length>0)

      {

      c_start=document.cookie.indexOf(c_name + "=")

      if (c_start!=-1)

        { 

        c_start=c_start + c_name.length+1 

        c_end=document.cookie.indexOf(";",c_start)

        if (c_end==-1) c_end=document.cookie.length

        return unescape(document.cookie.substring(c_start,c_end))

        } 

      }

    return ""

    }

    上面的函数首先会检查 document.cookie 对象中是否存有 cookie。假如 document.cookie 对象存有某些 cookie,那么会继续检查我们指定的 cookie 是否已储存。如果找到了我们要的 cookie,就返回值,否则返回空字符串。

    最后,我们要创建一个函数,这个函数的作用是:如果 cookie 已设置,则显示欢迎词,否则显示提示框来要求用户输入名字。

    function checkCookie()

    {

    username=getCookie('username')

    if (username!=null && username!="")

      {alert('Welcome again '+username+'!')}

    else 

      {

      username=prompt('Please enter your name:',"")

      if (username!=null && username!="")

        {

        setCookie('username',username,365)

        }

      }

    }

    这是所有的代码:

    <html>

    <head>

    <script type="text/javascript">

    function getCookie(c_name)

    {

    if (document.cookie.length>0)

      {

      c_start=document.cookie.indexOf(c_name + "=")

      if (c_start!=-1)

        { 

        c_start=c_start + c_name.length+1 

        c_end=document.cookie.indexOf(";",c_start)

        if (c_end==-1) c_end=document.cookie.length

        return unescape(document.cookie.substring(c_start,c_end))

        } 

      }

    return ""

    }

    function setCookie(c_name,value,expiredays)

    {

    var exdate=new Date()

    exdate.setDate(exdate.getDate()+expiredays)

    document.cookie=c_name+ "=" +escape(value)+

    ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())

    }

    function checkCookie()

    {

    username=getCookie('username')

    if (username!=null && username!="")

      {alert('Welcome again '+username+'!')}

    else 

      {

      username=prompt('Please enter your name:',"")

      if (username!=null && username!="")

        {

        setCookie('username',username,365)

        }

      }

    }

    </script>

    </head>

    <body onLoad="checkCookie()">

    </body>

    </html>

    12. JavaScript 动画

    使用 JavaScript 创建动态图像是可行的。

    <html>

    <head>

    <script type="text/javascript">

    function mouseOver()

      {

      document.b1.src ="/i/eg_mouse.jpg"

      }

    function mouseOut()

      {

      document.b1.src ="/i/eg_mouse2.jpg"

      }

    </script>

    </head>

    <body>

    <a href="http://www.w3school.com.cn" target="_blank">

    <img border="0" alt="Visit W3School!" src="/i/eg_mouse2.jpg" name="b1"

    onmouseOver="mouseOver()"

    onmouseOut="mouseOut()" />

    </a>

    </body>

    </html>

    13. setTimeout()

    语法

    var t=setTimeout("javascript语句",毫秒)

    setTimeout() 方法会返回某个值。在上面的语句中,值被储存在名为 t 的变量中。假如你希望取消这个 setTimeout(),你可以使用这个变量名来指定它。

    当下面这个例子中的按钮被点击时,一个提示框会在5秒中后弹出。

    <html>

    <head>

    <script type="text/javascript">

    function timedMsg()

     {

     var t=setTimeout("alert('5 seconds!')",5000)

     }

    </script>

    </head>

    <body>

    <form>

    <input type="button" value="Display timed alertbox!" onClick="timedMsg()">

    </form>

    </body>

    </html>

    13. HTML DOM 教程

    getElementById() 和 getElementsByTagName()

    getElementById() 和 getElementsByTagName() 这两种方法,可查找整个 HTML 文档中的任何 HTML 元素。

    getElementsByTagName() 方法会使用指定的标签名返回所有的元素(作为一个节点列表),这些元素是您在使用此方法时所处的元素的后代。

    2. parentNode、firstChild以及lastChild

    这三个属性 parentNode、firstChild 以及 lastChild 可遵循文档的结构,在文档中进行“短距离的旅行”。

    请看下面这个 HTML 片段:

    <table>

      <tr>

        <td>John</td>

        <td>Doe</td>

        <td>Alaska</td>

      </tr>

    </table>

    在上面的HTML代码中,第一个 <td> 是 <tr> 元素的首个子元素(firstChild),而最后一个 <td> 是 <tr>元素的最后一个子元素(lastChild)。

    此外,<tr> 是每个 <td>元 素的父节点(parentNode)。

    对 firstChild 最普遍的用法是访问某个元素的文本:

    var x=[a paragraph];

    var text=x.firstChild.nodeValue; 

    parentNode 属性常被用来改变文档的结构。假设您希望从文档中删除带有 id 为 "maindiv" 的节点:

    var x=document.getElementById("maindiv");

    x.parentNode.removeChild(x); 

    首先,您需要找到带有指定 id 的节点,然后移至其父节点并执行 removeChild() 方法。

  • 相关阅读:
    Exp5 MSF基础应用
    20155239 《网络对抗》Exp4 恶意代码分析
    20155239吕宇轩《网络对抗》Exp3 免杀原理与实践
    20155239 吕宇轩 后门原理与实践
    20155239吕宇轩 Exp1 PC平台逆向破解(5)M
    学号—20155239—吕宇轩《信息安全系统设计基础》课程总结
    20155238 2016-2017-2《Java程序设计》课程总结
    20155238 第十五周课堂实践
    20155238 实验四 Android程序设计
    20155238 《JAVA程序设计》实验三(敏捷开发与XP实践)实验报告
  • 原文地址:https://www.cnblogs.com/smileallen/p/3391576.html
Copyright © 2011-2022 走看看