`
海底的潮水
  • 浏览: 5062 次
  • 性别: Icon_minigender_2
  • 来自: 南京
社区版块
存档分类
最新评论

JavaScript

 
阅读更多
JS教程
JavaScript简介
   1 JavaScript 是脚本语言
   2 JavaScript 是一种轻量级的编程语言。
   3 JavaScript 是可插入 HTML 页面的编程代码。
   4 JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。

JavaScript使用
       HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
       脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。

JavaScript 输出
     如需从 JavaScript 访问某个 HTML 元素,您可以使用      document.getElementById(id) 方法。
    警告
     请使用 document.write() 仅仅向文档输出写内容。
     如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖:

JavaScript 语句
     JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。
     JavaScript 对大小写敏感。
     JavaScript 对大小写是敏感的。
       当编写 JavaScript 语句时,请留意是否关闭大小写切换键。
       函数 getElementById 与 getElementbyID 是不同的。
       同样,变量 myVariable 与 MyVariable 也是不同的。

JavaScript 注释
    单行注释以 // 开头
    多行注释以 /* 开始,以 */ 结尾。

JavaScript 变量
    变量必须以字母开头
    变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
    变量名称对大小写敏感(y 和 Y 是不同的变量)

JavaScript 数据类型
     字符串、数字、布尔、数组、对象、Null、Undefined。
     Undefined 这个值表示变量不含有值。可以通过将变量的值设置为 null 来清空    变量。

JavaScript 对象
    JavaScript 中的所有事物都是对象:字符串、数字、数组、日期,等等。
    在 JavaScript 中,对象是拥有属性和方法的数据。

JavaScript 函数
     函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块
     <script>
       function myFunction() {
         alert("Hello World!");
        }
      </script>

JavaScript 运算符
     [img][/img]



JavaScript 比较和逻辑运算符
      比较和逻辑运算符用于测试 true 或 false。
     [img][/img]



JavaScript If...Else 语句
     条件语句用于基于不同的条件来执行不同的动作。

JavaScript Switch 语句
     switch 语句用于基于不同的条件来执行不同的动作。
     [img][/img]



JavaScript For 循环
    循环可以将代码块执行指定的次数。
    不同类型的循环
    JavaScript 支持不同类型的循环:
      for - 循环代码块一定的次数
      for/in - 循环遍历对象的属性
      while - 当指定的条件为 true 时循环指定的代码块
      do/while - 同样当指定的条件为 true 时循环指定的代码块

JavaScript While 循环
     只要指定条件为 true,循环就可以一直执行代码。

JavaScript Break 和 Continue 语句
      break 语句用于跳出循环。
      continue 语句中断循环中的迭代,如果出现了指定的条件,然后继续循环中    的下一个迭代。

JavaScript 错误 - Throw、Try 和 Catch
     try 语句测试代码块的错误。
     catch 语句处理错误。
     throw 语句创建自定义错误。


JavaScript 表单验证
     JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行        验证。


JS HTML DOM

JavaScript HTML DOM
    通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。
    HTML DOM (文档对象模型)
     当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model    )。
     HTML DOM 模型被构造为对象的树。
     HTML DOM 树
     [img][/img]


    通过可编程的对象模型,JavaScript 获得了足够的能力来创建动态的 HTML。
    JavaScript 能够改变页面中的所有 HTML 元素
    JavaScript 能够改变页面中的所有 HTML 属性
    JavaScript 能够改变页面中的所有 CSS 样式
    JavaScript 能够对页面中的所有事件做出反应

JavaScript HTML DOM - 改变 HTML
    HTML DOM 允许 JavaScript 改变 HTML 元素的内容。
    提示:绝不要使用在文档加载之后使用 document.write()。这会覆盖该文档。
    document.getElementById("p1").innerHTML="New text!";
    document.getElementById("image").src="landscape.jpg";

JavaScript HTML DOM - 改变 CSS
    HTML DOM 允许 JavaScript 改变 HTML 元素的样式。
    document.getElementById(id).style.property=new style;
    document.getElementById("p2").style.color="blue";

JavaScript HTML DOM 事件
    HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。
    onclick=JavaScript
    HTML 事件的例子:
     。当用户点击鼠标时
     。当网页已加载时
     。当图像已加载时
     。当鼠标移动到元素上时
     。当输入字段被改变时
     。当提交 HTML 表单时
     。当用户触发按键时

JavaScript HTML DOM 元素(节点)
      添加和删除节点(HTML 元素)。
      创建新的 HTML 元素
       [img][/img]


      删除已有的 HTML 元素
      [img][/img]




JS 对象

JavaScript 对象
   JavaScript 中的所有事物都是对象:字符串、数值、数组、函数...
    此外,JavaScript 允许自定义对象。
    JavaScript 提供多个内建对象,比如 String、Date、Array 等等。
    对象只是带有属性和方法的特殊数据类型。
    如:string.length

JavaScript Number 对象
    JavaScript 只有一种数字类型。
    可以使用也可以不使用小数点来书写数字。
    八进制和十六进制
     如果前缀为 0,则 JavaScript 会把数值常量解释为八进制数,如果前缀为 0 和 "x",则解释为十六进制数
     var y=0377;
     var z=0xFF;
     数字属性和方法
      [img][/img]




JavaScript 字符串(String)对象
     String 对象用于处理已有的字符块。
    [img][/img]




JavaScript Date(日期)对象
    日期对象用于处理日期和时间。
    [img][/img]



    注意:表示月份的参数介于 0 到 11 之间。也就是说,如果希望把月设置为 8      月,则参数应该是 7。

JavaScript Array(数组)对象
   数组对象的作用是:使用单独的变量名来存储一系列的值。
    [img][/img]



     var mycars=new Array()
         mycars[0]="Saab"
         mycars[1]="Volvo"
         mycars[2]="BMW"
     也可以使用一个整数自变量来控制数组的容量:
        var mycars=new Array(3)
    var mycars=new Array("Saab","Volvo","BMW")

JavaScript Boolean(逻辑)对象
     Boolean(逻辑)对象用于将非逻辑值转换为逻辑值(true 或者 false)。

JavaScript Math(算数)对象
     Math(算数)对象的作用是:执行常见的算数任务。
     [img][/img]





JavaScript RegExp 对象
    RegExp 对象用于规定在文本中检索的内容。
    RegExp 对象的方法
    RegExp 对象有 3 个方法:test()、exec() 以及 compile()。
    定义 RegExp   var patt1=new RegExp("e");当您使用该 RegExp 对象在一个字     符串中检索时,将寻找的是字符 "e"。
   test()
      test() 方法检索字符串中的指定值。返回值是 true 或 false。
       var patt1=new RegExp("e");
      document.write(patt1.test("The best things in life are free"));
      以上代码的输出将是:true
    exec()
      exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹      配,则返回 null。
      var patt1=new RegExp("e");
      document.write(patt1.exec("The best things in life are free"));
      以上代码的输出将是:e
    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"));
     以上代码的输出是:truefalse


JS Window

JavaScript Window - 浏览器对象模型
   浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”。
   浏览器对象模型 (BOM)
   浏览器对象模型(Browser Object Model)尚无正式标准。
   Window 对象
   所有浏览器都支持 window 对象。它表示浏览器窗口。
   所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
   全局变量是 window 对象的属性。
   全局函数是 window 对象的方法。
   甚至 HTML DOM 的 document 也是 window 对象的属性之一:
   window.document.getElementById("header");
   Window 尺寸
  




JavaScript Window Screen
   window.screen 对象包含有关用户屏幕的信息。
   window.screen 对象在编写时可以不使用 window 这个前缀。
   一些属性:
     screen.availWidth - 可用的屏幕宽度
     screen.availHeight - 可用的屏幕高度
     screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,      比如窗口任务栏。

JavaScript Window Location
    window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新    的页面。

    window.location 对象在编写时可不使用 window 这个前缀。
     一些例子:
      location.hostname 返回 web 主机的域名
      location.pathname 返回当前页面的路径和文件名
      location.port 返回 web 主机的端口 (80 或 443)
      location.protocol 返回所使用的 web 协议(http:// 或 https://)
      [img][/img]



History---浏览器历史信息
    window.history 对象包含浏览器的历史。
    window.history 对象在编写时可不使用 window 这个前缀。
    一些方法:
      history.back() - 与在浏览器点击后退按钮相同
      history.forward() - 与在浏览器中点击按钮向前相同。
      history.go(n):正数表示向前,负数表示向后

Navigator---浏览器资料信息
    window.navigator 对象包含有关访问者浏览器的信息。
    window.navigator 对象在编写时可不使用 window 这个前缀。
       navigator.appCodeName 返回当前浏览器代码名字
       navigator.appName  返回浏览器名。
       navigator.appVersion 返回浏览器版本,包括了大版本号、小版本号、语言              、操作平台等信息。
       navigator.cookieEnabled
       navigator.systemLanguage  语言
       navigator.userAgent 返回以上全部信息。

PopupAlert---消息框
     消息框(警告框、确认框、提示框)
     警告框:alert("文本");
     确认框:confirm("文本")如果用户点击确认,那么返回值为 true。如果用户点                            击取消,那么返回值为 false。
     提示框:prompt("文本","默认值")如果用户点击确认,那么返回值为输入的值                                   。如果用户点击取消,那么返回值为 null。

Timing---计时
     在设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。我们称之     为计时事件
     在 JavaScritp 中使用计时事件是很容易的,两个关键方法是:
       setTimeout() 未来的某时执行代码.
       clearTimeout() 取消setTimeout()
     <html>

       <head>
         <script type="text/javascript">
             var c=0
             var t

             function timedCount(){
                document.getElementById('txt').value=c
                c=c+1
                t=setTimeout("timedCount()",1000)
               }

             function stopCount(){
                clearTimeout(t)
               }
          </script>
      </head>

      <body>
         <form>
            <input type="button" value="Start count!" onClick="timedCount()">
            <input type="text" id="txt">
            <input type="button" value="Stop count!" onClick="stopCount()">
          </form>
       </body>

     </html>

Cookies---用来识别用户
  • 大小: 68.4 KB
  • 大小: 12.9 KB
  • 大小: 2.5 KB
  • 大小: 4 KB
  • 大小: 27.2 KB
  • 大小: 26.4 KB
  • 大小: 3.3 KB
  • 大小: 7.1 KB
  • 大小: 6.8 KB
  • 大小: 6.6 KB
  • 大小: 5.2 KB
  • 大小: 9.9 KB
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    深入理解JavaScript系列

    本书是一本全面、深入介绍JavaScript语言的学习指南。本书共分四个部分,第1部分帮助读者快速入手,掌握基本的JavaScript编程要点;第2部分介绍JavaScript的发展和技术背景;第3部分深入探索JavaScript,介绍了语法...

    head first JavaScript源码

    《Head First JavaScript源码》是2010年出版的一本中文版JavaScript学习书籍的源码,这本书以其独特的视觉设计和易理解的方式深入浅出地介绍了JavaScript编程语言。JavaScript是一种广泛应用于网页和网络应用的脚本...

    JavaScript语言精粹完整版

    《JavaScript语言精粹》作为一本深入浅出讲解JavaScript编程语言的经典之作,对于想要提升自己JavaScript技能的开发者来说,无疑是一份宝贵的资源。本书由Douglas Crockford所著,他不仅是JSON格式的创始人,也是...

    Effective JavaScript: 68 Specific Ways to Harness the Power of JavaScript[EPUB版]

    Author David Herman, with his years of experience on Ecma’s JavaScript standardization committee, illuminates the language’s inner workings as never before—helping you take full advantage of ...

    VS2015安装证书,JavaScript_ProjectSystem.msi,JavaScript_LanguageService.msi

    在这个场景中,我们关注的是VS2015的安装过程中涉及到的证书问题以及两个特定的组件:JavaScript_ProjectSystem.msi和JavaScript_LanguageService.msi。 首先,关于“VS2015安装证书”,这通常是指安装过程中需要...

    《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf

    《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf《JavaScript程序设计案例教程》课件(共13章)第...

    面向对象JavaScript精要(英文原版pdf)

    ### 面向对象JavaScript精要 #### 一、书籍概览 本书《面向对象JavaScript精要》由Nicholas C. Zakas编写,是面向对象编程领域中的权威指南之一,尤其针对JavaScript这门语言。作者深入浅出地介绍了面向对象编程的...

    ArcGis-for-javaScript最全中文API.pdf

    ArcGIS JavaScript API 介绍与示例 ArcGIS JavaScript API 是 ESRI 提供的一种基于 JavaScript 的开发工具,允许开发者创建交互式的 Web 地图应用程序。本文将对 ArcGIS JavaScript API 进行详细的介绍,并提供多个...

    jQuery JavaScript与CSS开发入门经典

    jQuery将JavaScript编程量精简为寥寥数行代码,使JavaScript变得更直观,更富魅力。iQuery还允许同时为一个或多个元素设置样式,使得通过JavaScript操纵CSS变得分外轻松。 在这本面向项目的精品书籍的指引下,即使是...

    JavaScript结课大作业.zip

    JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责实现客户端的交互效果、动态更新内容以及处理用户输入。在"JavaScript结课大作业.zip"这个压缩包中,我们可以推测这是一份关于JavaScript编程的...

    JavaScript基础语法(ppt)

    JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)...

    JavaScript前端开发案例教程-源代码.rar

    JavaScript,作为全球最广泛使用的编程语言之一,是前端开发的核心技术。这个名为"JavaScript前端开发案例教程-源代码.rar"的压缩包文件提供了一系列实践案例,帮助开发者深入理解和掌握JavaScript在网页开发中的...

    Javascript 高级程序设计(第3版)超清中文PDF

    JavaScript,作为一种广泛应用于Web开发的脚本语言,已经成为现代互联网技术不可或缺的一部分。《JavaScript高级程序设计》(第3版)是一本深入探讨该语言精髓的权威书籍,它为读者提供了全面且深入的JavaScript知识...

    JavaScript DOM编程艺术【第2版&高清】.pdf

    但是,根据标题《JavaScript DOM编程艺术【第2版&高清】.pdf》和描述“JavaScript DOM编程艺术,高清资源,无比经典,值得拥有”,我们可以推断这本书主要讲述了JavaScript中DOM(文档对象模型)的相关编程技术。...

    JavaScript&jQuery;交互式Web前端开发

    通过将编程理论与用来演示JavaScript和jQuery如何被应用于流行站点之上的示例相结合,《JavaScript&jQuery;交互式Web前端开发》将教会您如何让网站更具交互性、吸引性、可用性。很快,您就能够像一名程序员那样去...

    [JavaScript] Effective JavaScript 编写高质量JavaScript代码的68个有效方法 (英文版)

    [Addison-Wesley Professional] Effective JavaScript 编写高质量JavaScript代码的68个有效方法 (英文版) [Addison-Wesley Professional] Effective JavaScript 68 Specific Ways to Harness the Power of ...

    arcgis api for javascript 中文帮助文档和demo

    《ArcGIS API for JavaScript 中文帮助文档与Demo详解》 ArcGIS API for JavaScript 是Esri公司提供的一款强大的JavaScript库,用于构建交互式的地理信息系统(GIS)应用。它为开发者提供了丰富的功能,包括地图...

    JavaScript手册 JavaScript手册

    JavaScript是一种广泛应用于网页和网络应用的编程语言,尤其在客户端脚本方面扮演着核心角色。JavaScript手册是学习和掌握这门语言的重要参考资料。手册通常包含了语言的基础语法、数据类型、控制结构、函数、对象、...

    JavaScript入门经典(第3版)高清PDF—3

    《JavaScript入门经典(第3版)》首先介绍了JavaScript的基本语法,并介绍了如何发挥JavaScript中对象的威力。《JavaScript入门经典(第3版)》还介绍了如何操纵最新版本浏览器所提供的BOM对象。在《JavaScript入门经典...

    JavaScript函数(源代码)

    JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)JavaScript函数(源代码)...

Global site tag (gtag.js) - Google Analytics