zoukankan      html  css  js  c++  java

  • 我的JavaScript学习笔记

    1.为了避免不支持JavaScript脚本的浏览器将脚本内容显示在页面上,我们可以在代码上加上注释:
    <html>
        <body>
            <script type="text/javascript">
                <!--
                    document.write("<h1>Hello World!</h1>")
                //-->
            </script>
        </body>
    </html>
    注释行末尾的两个正斜杠是 JavaScript 的注释符号，它会阻止 JavaScript 编译器对这一行的编译.

    2.如何调用外部JavaScript?
    <html>
        <head>
            <script src="/js/example_externaljs.js">
            </script>
        </head>
        <body>
            <p>
                The actual script is in an external script file called "xxx.js".
            </p>
        </body>
    </html>

    3.变量的寿命
    在函数中声明的变量只能在函数中使用。当你退出函数时，变量就会被释放.这种变量被称为局部变量.因为每个局部变量只在各自的函数中有效，所以你可以在不同的函数中使用名称相同的变量.
    如果在函数之外声明变量，那么页面中所有的函数都可以使用它.在全局变量被声明后，它们就开始生效了.在网页被关闭后，变量才会失效.

    4.实现随机链接
    <html>
    <body>
    <    script type="text/javascript">
    var r=Math.random()
    if (r>0.5)
    {
    document.write("<a href='http://www.w3school.com.cn'>Learn Web Development!</a>")
    }
    else
    {
    document.write("<a href='http://www.microsoft.com'>Visit Microsoft!</a>")
    }
    </script>
    </body>
    </html>

    5.脚本中如何取得日期值
    var d=new Date();
    theDay=d.getDay();        //theDay=0|1|2|...;
    其中Sunday=0, Monday=1, Tuesday=2, etc.

    6.比较运算符===
    === 等于(检查值和类型) x=5 y="5" x==y 返回值为 true x===y 返回值为 false


    7.确认框
    <html>
    <head>
    <script type="text/javascript">
    function disp_confirm()
      {
      var r=confirm("Press a button")
      if (r==true)
        {
        document.write("You pressed OK!")
        }
      else
        {
        document.write("You pressed Cancel!")
        }
      }
    </script>
    </head>
    <body>
    <input type="button" onclick="disp_confirm()" value="Display a confirm box" />
    </body>
    </html>

    8.提示框
    <html>
    <head>
    <script type="text/javascript">
    function disp_prompt()
      {
      var name=prompt("Please enter your name","Harry Potter")
      if (name!=null && name!="")
        {
        document.write("Hello " + name + "! How are you today?")
        }
      }
    </script>
    </head>
    <body>
    <input type="button" onclick="disp_prompt()" value="Display a prompt box" />
    </body>
    </html>
    其中语法为:prompt("文本","默认值")

    9.带有确认框的try...catch...语句
    <html>
    <head>
    <script type="text/javascript">
    var txt=""
    function message()
    {
    try
      {
      adddlert("Welcome guest!")    //此处正确语法为:alert("...");
      }
    catch(err)
      {
      txt="There was an error on this page.\n\n"
      txt+="Click OK to continue viewing this page,\n"
      txt+="or Cancel to return to the home page.\n\n"
      if(!confirm(txt))    //产生确认框;
        {
        document.location.href="http://www.w3school.com.cn/"
        }
      }
    }
    </script>
    </head>
    <body>
    <input type="button" value="View message" onclick="message()" />
    </body>
    </html>
    若要捕获错误描述,代码为:err.description

    10.判断变量是否Number型:isNaN(x)

    11.如何使用 onerror 事件来捕获错误?
    <html>
    <head>
    <script type="text/javascript">
    onerror=handleErr
    var txt=""
    function handleErr(msg,url,l)
    {
    txt="There was an error on this page.\n\n"
    txt+="Error: " + msg + "\n"
    txt+="URL: " + url + "\n"
    txt+="Line: " + l + "\n\n"
    txt+="Click OK to continue.\n\n"
    alert(txt)
    return true
    }
    function message()
    {
    adddlert("Welcome guest!")
    }
    </script>
    </head>
    <body>
    <input type="button" value="View message" onclick="message()" />
    </body>
    </html>

    12.如何在 JavaScript 中使用反斜杠来向文本字符串添加特殊字符?

    代码 输出
    \' 单引号
    \" 双引号
    \& 和号
    \\ 反斜杠
    \n 换行符
    \r 回车符
    \t 制表符
    \b 退格符
    \f 换页符
    补充:你可以在字符串内部使用反斜杠对代码进行折行。下面的例子是正确的:
    document.write("Hello \
    World!")

    13.使用字符串对象的 toUpperCase() 方法来显示大写字母文本,如下例子:
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.toUpperCase())
    </script>
    上面的代码输出为:HELLO WORLD!

    14.如何为字符串添加样式?
    <html>
    <body>
    <script type="text/javascript">
    var txt="Hello World!"
    document.write("<p>Big: " + txt.big() + "</p>")
    document.write("<p>Small: " + txt.small() + "</p>")
    document.write("<p>Bold: " + txt.bold() + "</p>")
    document.write("<p>Italic: " + txt.italics() + "</p>")
    document.write("<p>Blink: " + txt.blink() + " (does not work in IE)</p>")
    document.write("<p>Fixed: " + txt.fixed() + "</p>")
    document.write("<p>Strike: " + txt.strike() + "</p>")
    document.write("<p>Fontcolor: " + txt.fontcolor("Red") + "</p>")
    document.write("<p>Fontsize: " + txt.fontsize(16) + "</p>")    document.write("<p>Lowercase: " + txt.toLowerCase() + "</p>")
    document.write("<p>Uppercase: " + txt.toUpperCase() + "</p>")    document.write("<p>Subscript: " + txt.sub() + "</p>")
    document.write("<p>Superscript: " + txt.sup() + "</p>")
    document.write("<p>Link: " + txt.link(http://www.cnblogs.com/guoxiaowen) + "</p>")
    </script>
    </body>
    </html>
    运行结果为:
    Big: Hello World!
    Small: Hello World!
    Bold: Hello World!
    Italic: Hello World!
    Blink: Hello World! (does not work in IE)    //文字闪烁
    Fixed: Hello World!
    Strike: Hello World!
    Fontcolor: Hello World!
    Fontsize: Hello World!

    Lowercase: hello world!
    Uppercase: HELLO WORLD!
    Subscript: Hello World!
    Superscript: Hello World!
    Link: Hello World!

    15.如何使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置?
    <html>
    <body>
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.indexOf("Hello") + "<br />")
    document.write(str.indexOf("World") + "<br />")
    document.write(str.indexOf("world"))
    </script>
    </body>
    </html>
    运行结果为:
    0
    -1
    6

    16.如何使用 match() 来查找字符串中特定的字符，并且如果找到的话，则返回这个字符,否则返回null
    <html>
    <body>
    <script type="text/javascript">
    var str="Hello world!"
    document.write(str.match("world") + "<br />")
    document.write(str.match("World") + "<br />")
    document.write(str.match("worlld") + "<br />")
    document.write(str.match("world!"))
    </script>
    </body>
    </html>
    运行结果为:
    world
    null
    null
    world!

    17.如何使用 replace() 方法在字符串中用某些字符替换另一些字符
    <html>
    <body>
    <script type="text/javascript">
    var str="Visit Microsoft!"
    document.write(str.replace(/Microsoft/,"W3Schools"))    //此处用的'/'可以用双引号替代
    </script>
    </body>
    </html>

    18.如何获得当日的日期和时间?
    <html>
    <body>
    <script type="text/javascript">
    document.write(Date())
    </script>
    </body>
    </html>
    运行结果为:Wed Feb 27 09:26:53 2008

    19.如何使用 setFullYear() 得到精确的日期?
    <html>
    <body>
    <script type="text/javascript">
    var d = new Date()
    d.setFullYear(1992,10,3)
    document.write(d)
    </script>
    </body>
    </html>
    运行结果为:Tue Nov 3 09:48:00 UTC+0800 1992
    此处改变setFullYear(1992,10,3)中的参数,即可查询设定参数的精确日期

    20.toUTCString():返回一个已被转换为字符串的，用全球标准时间 (UTC)表示的日期.
    <html>
    <body>
    <script type="text/javascript">
    var d = new Date()
    document.write (d.toUTCString())
    </script>
    </body>
    </html>
    运行结果为:Wed, 27 Feb 2008 01:54:59 UTC    //我们与全球标准时间相差8个时区UTC+0800即为我们的北京时间
  • 相关阅读:
    正则表达式(验证账号密码邮箱身份证)
    JS Fetch
    事件流动
    JS DOM和BOM
    CSS的定位
    For each...in / For...in / For...of 的解释和例子
    CSS的gridlayout
    CSS position属性
    CSS的颜色
    twelfth week
  • 原文地址：https://www.cnblogs.com/guoxiaowen/p/1082580.html
Copyright © 2011-2022 走看看