1、思维导图

2、创建html页面

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

 <title>无标题文档</title>

 <script type="text/javascript" src="js/js_index1.js"></script>

 </head>

 <body>

 <p onclick="sysTest()">点点我</p>

 </body>

 </html>

js_index.html

3、创建外部js文件

 // JavaScript Document

     //加载事件=java的main方法

     window.onload=function(){

         //1.调用验证数据类型的函数

         //datatype();

         //2.String类型变量的属性和方法

           //stringMethod();

           //3.数组的使用

          // arrayTest();

          //4.String转换为各种类型

         // sysTest();

     }

     //4.String转换为各种类型

     function sysTest(){

       //var num1=prompt("1:");

       //var num2=prompt("2:");

       //var num11=parseInt(num1);

       //var num22=parseInt(num2);

       var num="12a";

     //  alert(parseInt(num));

       var num2="12.5.1a";

       alert(parseFloat(num2));

     }

     //3.数组的使用

     function arrayTest(){

        //3.1 定义数组

        var  str=new Array(4);

        //3.2 为数组赋值

        str[0]=4;

        str[1]=2;

        str[2]=3;

        str[3]=1;

        //3.3 获取某个索引下标的值

        document.write(str[1]+"</br>");

        //3.4 循环打印

        for(var i=0;i<str.length;i++){

          document.write(str[i]);

        }

         document.write("</br>");

        //3.5边定义边赋值

        var strarr=new Array("a","b","c");

        for(var i in strarr){

          document.write(strarr[i]);

        }

        document.write("</br>");

        //3.6 数组的方法

         document.write(strarr.join("-"));

          document.write("</br>");

         //3.7数组排序

         str.sort();

          for(var i=0;i<str.length;i++){

          document.write(str[i]);

        }

     }

     //2.String类型变量的属性和方法

     function stringMethod(){

        var str="a,b,c,d,e,f,g,h,i";

        //2.1求得字符串的长度

        document.write("abcdefghi字符串的长度："+str.length+"</br>");

        //2.2将字符串转换为大写

        document.write("abcdefghi转换为大写："+str.toUpperCase()+"</br>");

        //2.3将字符串转换为小写

        document.write("abcdefghi转换为大写："+str.toLowerCase()+"</br>");

        //2.4 返回字符串指定字符

        document.write("abcdefghi返回索引3的字符"+str.charAt(3)+"</br>");

        //2.5 查找字符串是否包含指定字符

        document.write("abcdefghi查找d字符"+str.indexOf("d")+"</br>");

        //2.6 截取字符(包头不包尾)

        document.write("abcdefghi查找d字符"+str.substring(1,6)+"</br>");

        //2.7 截取字符(开始位置，长度)

        document.write("abcdefghi查找d字符"+str.substr(0,5)+"</br>");

        //2.8 将字符串拆分成数组

        var strarray=str.split(",");

        //循环遍历

        document.write("循环遍历");

        for(var i in strarray){

           document.write(strarray[i]);

        }

     }

     //1.定义无返回值无参数的函数(方法)

     function datatype(){

          //输出语句=System.out.print（“aaa”）;

         var str="Hello World!";

         document.write("<h3>Hello World!数据类型："+typeof(str)+"</h3>");

         var num1=11;

         document.write("11数据类型："+typeof(num1)+"</br>");

         var num;

         document.write("没有赋值数据类型："+typeof(num)+"</br>");

         var str1=num;

         document.write("null数据类型："+typeof(str1)+"</br>");

         var str2=true;

         document.write("true数据类型："+typeof(str2)+"</br>");

         var date=new Date();

          document.write("Date数据类型："+typeof(date)+"</br>");

     }

js_index.js

1、JavaScript基础的更多相关文章

  1. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  2. 一步步学习javascript基础篇（0）:开篇索引

    索引: 一步步学习javascript基础篇(1):基本概念 一步步学习javascript基础篇(2):作用域和作用域链 一步步学习javascript基础篇(3):Object.Function等 ...

  3. 前端之JavaScript基础

    前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...

  4. 一步步学习javascript基础篇（3）：Object、Function等引用类型

    我们在<一步步学习javascript基础篇(1):基本概念>中简单的介绍了五种基本数据类型Undefined.Null.Boolean.Number和String.今天我们主要介绍下复杂 ...

  5. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  6. Javascript基础回顾 之(二) 作用域

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  7. Javascript基础回顾 之(一) 类型

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

  8. JavaScript 基础回顾——对象

    JavaScript是基于对象的解释性语言,全部数据都是对象.在 JavaScript 中并没有 class 的概念,但是可以通过对象和类的模拟来实现面向对象编程. 1.对象 在JavaScript中 ...

  9. javascript基础01

    javascript基础01 Javascript能做些什么? 给予页面灵魂,让页面可以动起来,包括动态的数据,动态的标签,动态的样式等等. 如实现到轮播图.拖拽.放大镜等,而动态的数据就好比不像没有 ...

  10. javascript基础02

    javascript基础02 1.数据类型 数据类型的描述在上篇的扩展中有写到链接 由于ECMAScript数据类型具有动态性,因此的确没有再定义其他数据类型的必要.这句话很重要. 如果以后再数据类型 ...

随机推荐

  1. Linux CentOS 7 YUM 安裝 MySQL 5.7

    MySQL YUM 源:http://dev.mysql.com/downloads/repo/yum/ # 下載源 $ wget http://dev.mysql.com/get/mysql57-c ...

  2. 分享基于.NET MVC+EF CodeFirst+IOC+EasyUI的框架设计

    **注:要做工,没什么时间,等有空时会上传到GIT,项目结构如上,简单的说一下: **支持IOC及多数据库等,各项目由MVC区域隔离: 主要使用基于接口与抽象类进行高度的抽象与接口隔离,与其它框架比较 ...

  3. express 4.x 文件上传

    1.安装文件上传模块: npm install multiparty --save 2.在routes/index.js 中添加: // 引用模块 let multiparty = require(& ...

  4. 64位Java开发平台的选择，如何区分JDK,Tomcat,eclipse的32位与64版本

    当你想下载Linux.JDK.Tomcat.eclipse时,你是下载32位版本还是64位版本?64位版本有两种,应该选哪一个? 当你看到这些内容:x86.x64.x86-32.x86-64.ia64 ...

  5. 关于spring autowrie的5种方式

    spring自动注入有5中方式,分别是: byName:根据自动注入类中的对象名字,会到配置文件中找相关id或者name的bean,如果找不到则不会匹配,如果找到多个bean,则会报错. byType ...

  6. Attribute的理解和认识

    1什么是Attribute? 在网上看到这样一段定义 MADN的定义为:公共语言运行时允许添加类似关键字的描述声明,叫做attributes, 它对程序中的元素进行标注,如类型.字段.方法和属性等.A ...

  7. 移动端audio自动播放问题

    中秋临近,心血来潮想做个手机端贺卡,以前接触的移动端较少,虽然是个简单的贺卡,其实也蛮多坑的,简略说一下在制作贺卡的过程遇到的坑: 一:移动端的屏幕大小不能算作body的大小,因为手机浏览器头部都有网 ...

  8. Design Pattern - Strategy

    Strategy Pattern:     The Strategy Pattern defines a family of algorithms,encapsulates each one,and ...

  9. jQuery 设置select默认选中问题

    在进行其他操作后,恢复select默认选中 html代码: <select id="shai" style="width:150px;margin:5px 50px ...

  10. redis10--主从模式

    redis的主从模式(1)介绍redis存储数据是在内存中运行的,运行速度比关系型数据库要快一些.而且它具有SortSet/Hash等具有特色的数据类型,这是其它数据库无法比拟的.redis有增删改查 ...