javascript学习

时间:2024.4.20

1:javascript有个事件机制,可以在网页上发生某个事件时,才触发某一段javascript代码

2:onload事件在网页载入完毕后触发。设定<body>标签的onload属性即可对onload事件有所响应。

3:javaScript 使用三种基本数据类型:text,number,boolean.

4:javacript 专门描述没有值的状态的值是:undefined.NaN是个非数字的值。

5:var numCakeDonuts = parseInt(document.getElementById("cakedonuts").value);

        var numGlazedDonuts = parseInt(document.getElementById("glazeddonuts").value);

        if(isNaN(numCakeDonuts)){将整数字符串转换成整数

               numCakeDonuts =0;

        }

        if(isNaN(numGlazedDonuts)){//判断是不是一个数字

               numGlazedDonuts = 0;

        }

document.getElementById("total").value = "$" + total.toFixed(2);函数把金额四舍五入到小数点的

后两位。

6:定时器让我们能在一段时限流逝后才运行javascript代码。

制作单次定时器setTimeout("alert('Wake up!');",60000);

间隔定时器 var timerID = setInterval("alert('Wake up!');",60000);

7:document.getElementById("rockImg").style.height = (document.body.clientHeight -100)*0.9;

 <body onload="resizeRock();greetUser();" onresize="resizeRock();">

调整浏览器窗口的尺寸将触发onresize事件

8:javaScript于浏览器关闭或网页重新载入时摧毁所有的变量。

cookie是浏览器存储在用户计算机里的一块数据。

javaScript+cookie = 适合客户端便利的持久性数据存储方案。

if(navigator.cookieEnabled){//检查浏览器是否支持cookie

                 userName = readCookie("irock_username");

          }

9:

我们熟悉的函数创建方式

function showSeatStatus(seatNum){

       alert("this seat is");

}

另一种创建函数的方式

var showSeatStatus = function(seatNum){

alert("this seat is");

}

var myShowSeatStatus = showSeatStatus;

调用或引用你的函数

10:

 window.onload = function(){

      document.getElementById("findseat").onclick = findSeat;

      // Wire the seat image events

        document.getElementById("seat0").onclick = function(evt) { showSeatStatus(0); };

11:怎样取得表单中的值

form 对象厉害的地方在于它也是个数组,负责存储表单中所有的域。利用域的名字存储。

form["zipcode"].value;

12:不在是焦点:onblur 每次输入选择离开都会触发这个事件。onblur事件极度适应触发数据验证。失去

焦点时被触发。

13:正则表达式:用于匹配文本的模式。

正则表达式出现在一对//里。

元字符:

正则表达式的限定符

利用正则表达式验证数据

<html>

  <head>

    <title>Bannerocity - Personalized Online Sky Banners</title>

    <link rel="stylesheet" type="text/css" href="bannerocity.css" />

    <script type="text/javascript">

      function validateRegEx(regex, input, helpText, helpMessage) {

        // See if the input data validates OK

        if (!regex.test(input)) {

          // The data is invalid, so set the help message and return false

          if (helpText != null)

            helpText.innerHTML = helpMessage;

          return false;

        }

        else {

          // The data is OK, so clear the help message and return true

          if (helpText != null)

            helpText.innerHTML = "";

          return true;

        }

      }

      function validateNonEmpty(inputField, helpText) {

        // See if the input value contains any text

        return validateRegEx(/.+/,

          inputField.value, helpText,

          "Please enter a value.");

      }

      function validateLength(minLength, maxLength, inputField, helpText) {

        // See if the input value contains at least minLength but no more than maxLength characters

        return validateRegEx(new RegExp("^.{" + minLength + "," + maxLength + "}$"),

          inputField.value, helpText,

          "Please enter a value " + minLength + " to " + maxLength +

          " characters in length.");

      }

      function validateZipCode(inputField, helpText) {

        // First see if the input value contains data

        if (!validateNonEmpty(inputField, helpText))

          return false;

        // Then see if the input value is a ZIP code

        return validateRegEx(/^\d{5}$/,

          inputField.value, helpText,

          "Please enter a 5-digit ZIP code.");

      }

      function validateDate(inputField, helpText) {

        // First see if the input value contains data

        if (!validateNonEmpty(inputField, helpText))

          return false;

        // Then see if the input value is a date

        return validateRegEx(/^\d{2}\/\d{2}\/(\d{2}|\d{4})$/,

          inputField.value, helpText,

          "Please enter a date (for example, 01/14/1975).");

      }

      function validatePhone(inputField, helpText) {

        // First see if the input value contains data

        if (!validateNonEmpty(inputField, helpText))

          return false;

        // Then see if the input value is a phone number

        return validateRegEx(/^\d{3}-\d{3}-\d{4}$/,

          inputField.value, helpText,

          "Please enter a phone number (for example, 123-456-7890).");

      }

      function validateEmail(inputField, helpText) {

        // First see if the input value contains data

        if (!validateNonEmpty(inputField, helpText))

          return false;

        // Then see if the input value is an email address

        return validateRegEx(/^[\w\.-_\+]+@[\w-]+(\.\w{2,3})+$/,

          inputField.value, helpText,

          "Please enter an email address (for example, johndoe@acme.com).");

      }

      function placeOrder(form) {

        if (validateLength(1, 32, form["message"], form["message_help"]) &&

          validateZipCode(form["zipcode"], form["zipcode_help"]) &&

          validateDate(form["date"], form["date_help"]) &&

          validateNonEmpty(form["name"], form["name_help"]) &&

          validatePhone(form["phone"], form["phone_help"]) &&

          validateEmail(form["email"], form["email_help"])) {

          // Submit the order to the server

          form.submit();

        } else {

          alert("I'm sorry but there is something wrong with the order information.");

        }

      }

    </script>

  </head>

  <body onload="document.getElementById('message').focus()">

    <div class="heading">

      <img id="logo" src="logo.png" alt="Bannerocity" />

    </div>

    <form name="orderform" action="bannerocity.php" method="POST">

      <div class="field">

        Enter the banner message:

        <input id="message" name="message" type="text" size="32"

          onblur="validateLength(1, 32, this, document.getElementById('message_help'))" />

        <span id="message_help" class="help"></span>

      </div>

      <div class="field">

        Enter ZIP code of the location:

        <input id="zipcode" name="zipcode" type="text" size="5"

          onblur="validateZipCode(this, document.getElementById('zipcode_help'))" />

        <span id="zipcode_help" class="help"></span>

      </div>

      <div class="field">

        Enter the date for the message to be shown:

        <input id="date" name="date" type="text" size="10"

          onblur="validateDate(this, document.getElementById('date_help'))" />

        <span id="date_help" class="help"></span>

      </div>

      <div class="field">

        Enter your name:

        <input id="name" name="name" type="text" size="32"

          onblur="validateNonEmpty(this, document.getElementById('name_help'))" />

        <span id="name_help" class="help"></span>

      </div>

      <div class="field">

        Enter your phone number:

        <input id="phone" name="phone" type="text" size="12"

          onblur="validatePhone(this, document.getElementById('phone_help'))" />

        <span id="phone_help" class="help"></span>

      </div>

      <div class="field">

        Enter your email address:

        <input id="email" name="email" type="text" size="32"

          onblur="validateEmail(this, document.getElementById('email_help'))" />

        <span id="email_help" class="help"></span>

      </div>

      <input type="button" value="Order Banner" onclick="placeOrder(this.form);" />

    </form>

  </body>

</html>

14:改变文本的安全三步骤

15:数据+行为=对象

16:自定义对象

function Blog(body,date){

                            this.body = body;

                            this.date = date;

                            this.toString = function(){

                                   return "[" +(this.date.getMonth()+1) +"/" + this.date.getDate() +"/"

                                    + this.date.getFullYear()+"]" + this.body;

                            }

                           

不像特性需要为每个对象存储独特数据,方法应该为对象所共享。所以所有的Blog对象共享一份方法副本,将是更好的设计。这就需要类方法

类属性必须通过this关键字访问。

18:怎样把方法加到标准javaScript对象中。

18:Ajax

Xml是种为任何类型的数据设计格式的标记语言。

Xhtml是现代版的html遵循xml的严格规则。

<input type="button" id="showall" value="Show All Blog Entries" disabled="disabled" //禁用一个按钮onclick="showBlog();" />

document.getElementById("search").disabled = false; //启用按钮

更多相关推荐:
javascript学习总结

javascript学习总结1JavaScript中的对象分为3种1JavaScript的内置对象常用的有DateArrayStringMath对象这些都是经常会用到的一定要掌握好2文档对象模型Document...

javascript学习总结

脚本语言:1、介于html与java,php之间的语言,能力比java,php弱,比html强,单独使用起不了大作用,需要配合其他语言发挥其作用;2、3、4、5、javascript有自己的变量,函数以及控制语…

javascript学习总结

一JavaScriptJavaScript被设计用来向HTML页面添加交互行为JavaScript是一种脚本语言脚本语言是一种轻量级的编程语言JavaScript由数行可执行计算机代码组成JavaScript通...

Javascript学习总结

JavaScript学习总结1234567JavaScript概述3数据类型3数字3字符串3布尔类型4函数4对象4a创建JavaScript对象的两种语法4b自定义对象类型58数组59变量510基本类型和引用类...

JavaScript考点总结

Netscape公司为了扩展其浏览器的功能开发了一种名为LiveScript的脚本语言Sun公司联合宣布把其更名为Javascript欧洲计算机制作商协会ECMA形成ECMA262标准定义了ECMAScript...

JavaScript学习总结

JavaScript学习总结由于以前JavaScript用的比较的少所以对JavaScript的认识非常的肤浅这周看了蛮多关于javascript的书和文档对JavaScript终于有了一些初步的认识总结一下希...

javascript学习总结

Javascrip基础与实践教程电子工业出版社一javascrip语言概述1ECMAScript是许多软件厂商对JavaScript的统一标准2服务器端和客户端JavaScript共享相同的核心语言但也有些不同...

JavaScript基础总结

JavaScript基础总结,内容附图。

总结常用JavaScript语法107条

总结常用JavaScript语法107条文章总结了JS中常用的语法希望能对大家提供帮助1输出语句documentwritequotquot2JS中的注释为3传统的HTML文档顺序是documentgthtmlg...

Javascript经典小技巧总结

1documentwritequot输出语句2JS中的注释为3传统的HTML文档顺序是documentgthtmlgtheadbody4一个浏览器窗口中的DOM顺序是windowgtnavigatorscree...

JavaScript 错误处理与调试总结

在Web开发过程中编写JavaScript程序时或多或少会遇到各种各样的错误有语法错误逻辑错误如果是一小段代码可以通过仔细检查来排除错误但如果程序稍微复杂点调试JS便成为一个令Web开发者很头痛的问题下面总结一...

javaScript 删除确认实现方法小结

javaScript删除确认实现方法小结第一种方法挺好用的确认以后才能打开下载地址页面原理也比较清晰主要用于删除单条信息确认详细出处参考article21543htmltSCRIPTLANGUAGEjavasc...

javascript学习总结(21篇)