澳门新萄京官方网站-www.8455.com-澳门新萄京赌场网址

活动端h5开荒相关内容总计,jquery基础教程

2019-06-08 作者:澳门新萄京赌场网址   |   浏览(175)

移动端h5开发相关内容总结(四)

2017/02/06 · HTML5 · 1 评论 · 移动端

本文作者: 伯乐在线 - zhiqiang21 。未经作者许可,禁止转载!
欢迎加入伯乐在线 专栏作者。

一:JavaScript是一种描述性语言,它是一种基于对象(Object)和事件驱动(Event Drivent)的,并且具有安全性能的脚本语言。
特点:

Jquery基础,jquery基础教程

1、JQuery概念

Jquery是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。

JavaScript的缺点:控件的操作方式不统一,不同浏览器容易出观兼容问题。为了简化操作,出现了许多对JavaScript封装的函数库比如Prototype、JQuery等。

JQuery的优点:小巧、方便、功能强大。插件丰富、开源、免费。

JQuery文件说明:

       jquery-1.4.2.js是JQuery主文件。

       jquery-1.4.2.min.js是压缩板JQuery主文件。

       jquery-1.4.2-vsdoc.js是JQuery在VS中的自动提示功能。

 

2.JS的常用方法——函数

在JS中,函数类似于java中的方法,是执行特定功能的JavaScript代码块。但是JS中的函数使用更简单,不用定义函数属于 哪个类,因此调用时不需要用“对象名.方法名()”的方式,直接使用函数名称来调用函数即可。

JavaScript中的函数有两种:一种是Javascript自带的系统函数,另一种是用户自行创建的自定义函数

JavaScript提供了两种把非数字的原始值转换成数字的函数,即parseInt()和parseFloat()。另外,它还提供了一个检查是否是非数字的函数isNaN(),通常用于逻辑判断。

一.parseInt()

parseInt()函数可解析一个字符串,并返回一个整数,语法格式如下:

parseInt("字符串")

parseInt()函数首先查看位置0处的字符,判断他是否为一个有效数字,如果不是则返回NaN,不再继续执行其他操作。但如果该字符是有效数字,则该函数将查看位置1处的字符,进行同样的测试,这一过程将持续到发现非有效数字的字符为止,此时parseInt()将该字符之前的字符串转换成数字,例如:

         var num1=parseInt("78.89")          //返回值为78

         var num2=parseInt("4567color")    //返回值为4567

         var num3=parseInt("this36")          //返回值为NaN

 

实例:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>类型转换函数的应用</title>
</head>
<body>
    <script type="text/javascript">
        var op1 = prompt("请输入第一个数:", "")
        var op2 = prompt("请输入第二个数:", "")
        var p1 = parseInt(op1);
        var p2 = parseInt(op2);
        var result = p1   p2;
        document.write(p1   " "   p2   "="   result);
    </script>
</body>
</html>

运行结果如下:

图片 1

二.parseFloat()

parseFloat()函数可解析一个字符串,并返回一个浮点数,语法格式如下。

parseFloat("字符串")

例如:

          var num1=parseFloat("4567color");         //返回值为4567

          var num1=parseFloat("45.58");               //返回值为45.58

          var num1=parseFloat("45.58.25")            //返回值为45.58

          var num1=parseFloat("color4567")           //返回值为NaN

 

三.isNaN()

isNaN()函数用于检查其参数是否是非数字,语法格式如下:

isNaN(x)

如果x是特殊的非数字值,则返回值是true,否则返回false。例如:

    var flag1=isNaN("12.5");                //返回值为false

    var flag2=isNaN("12.5s")                //返回值为true

    var flag3=isNaN(45.8)                    //返回值为false

 

2.自定义函数

语法:

         function函数名(参数1,参数2,参数3,.......){

               //JavaScript语句;

               [return 返回值]

         }

function是定义函数的关键字,必须有。

一.调用函数:

要执行一个函数,必须先调用这个函数,当调用函数时,必须指定函数名及其后名的参数(如果有参数)。函数的调用一般和元素的事件结合使用,语法格式如下:

      事件名="函数名()";

实例:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无参函数——使用函数显示Hello World多次</title>
    <script type="text/javascript">
        function showHello() {
            for (var i = 0; i < 5; i  ) {
                document.write("<h2>Hello World</h2>");
            }
        }
    </script>
</head>
<body>
    <input type="button"  name="btn" value="显示5次HelloWorld" onclick="showHello()"/>
</body>
</html>

运行结果:

图片 2

图片 3

3.匿名函数

一.匿名函数的定义

    匿名函数是没有函数名的。如下:

         function (count){

                for(var i = 0;i<count;i ){

                      document.write("<h2>Hello World</h2>");

                }

         }

 

二.匿名函数的调用

实例:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>使用匿名函数显示</title>
    <script type="text/javascript">
        var showFun = function (count) {
            for (var i = 0; i < count; i  ) {
                document.write("<h2>Hello World</h2>")
            }
        };
    </script>
</head>
<body>
    <input type="button" name="btn" value="请输入显示Hello World的次数" onclick="showFun(prompt('请输入显示Hello World的次数:',''))"/>
</body>
</html>

运行结果:

图片 4

图片 5

1、JQuery概念 Jquery是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQuery2.0及后续...

1、JQuery概念

1、JQuery概念

前言:

看了下博客的更新时间,发现9月份一篇也没有更新。一直想着都要抽时间写一篇的,不然今年的更新记录就会断在了9月份。但是还是应为各种各样的事情给耽搁了。当内心突然涌起一股必须写点什么的时候,突然发现自己把写博客的“套路”都忘了。(●´ω`●)φ

一直认为自己还是一个比较热爱思考的人。最近一直在思考两个问题:

  1. 自己做技术的初衷;
  2. 自己的技术成长之路;

当然这两篇文章自己也在润色之中,相信很快会跟大家见面。

废话不多说。来正菜。

>JavaScript主要用来向HTML页面中添加交互行为。

Jquery是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。

Jquery是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器,jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可。

1.背景色与透明度相关知识

好吧。至从自己到了新的工作环境以后,开发环境又从只需要兼容 IE8 以上回到了必须兼容 IE6 浏览器上来。所以在第一次做项目的时候,还是遇到一些兼容低版本IE浏览器的问题。

首先来看一个背景透明的问题,背景透明有三种解决方案:

  1. IE6-7使用滤镜;
  2. opcity;
  3. rgba;

但是他们也有些细微的差别总结如下:

图片 6

示例效果如下(如果可以的话,自己可以写一个简单的demo看下效果):

第一个是opcity和rgab的区别

图片 7

第二张是在ie6中的效果:

图片 8

当我们在兼容低版本浏览器的时候可能下面的写法可以满足我们的需求(两个属性都写上,浏览器识别的属性直接覆盖前者的属性):

CSS

.item1{ opacity:0.1;//IE8以上浏览器识别 filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);//滤镜低版本IE7-8支持 }

1
2
3
4
.item1{
    opacity:0.1;//IE8以上浏览器识别
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);//滤镜低版本IE7-8支持
}

>JavaScript是一种脚本语言,语法和Java类似

JavaScript的缺点:控件的操作方式不统一,不同浏览器容易出观兼容问题。为了简化操作,出现了许多对JavaScript封装的函数库比如Prototype、JQuery等。

JavaScript的缺点:控件的操作方式不统一,不同浏览器容易出观兼容问题。为了简化操作,出现了许多对JavaScript封装的函数库比如Prototype、JQuery等。

2. html5标签呼起系统发件箱

做html5开发的过程中,我们可能会有这样的需求:

点击按钮,呼起系统的发送短信的窗口,并且自动填充发送到的号码和内容;

网络上可以很容易的找到这方面的demo ,并且也可以找到在安卓上和ios上是有却别的:

XHTML

<!-- ios--> <a href="sms:10086&body=发送的内容">点击我发送短信</a> <!-- android--> <a href="sms:10086?body=发送的内容">点击我发送短信</a>

1
2
3
4
<!-- ios-->
<a href="sms:10086&body=发送的内容">点击我发送短信</a>
<!-- android-->
<a href="sms:10086?body=发送的内容">点击我发送短信</a>

但是在实际的开发过程中却遇到了很多坑。主要原因是:
除了安卓和IOS系统的写法不同外,ios不同系统版本写法也不同。而且在不同的app中也有不同。

上面的原因是在生产环境遇到的问题。刚开始因为找不到相关可以查阅的文档只能不做兼容。偶然一次在 stackoverflow 发现了问题的原因。

原文内容如下:

图片 9

翻译后总结如下:

图片 10

所以,如果在生产环境中有呼起系统发件箱并且填充号码和内容的请注意以上的区别。

>JavaScript一般用来编写客户端的脚本

JQuery的优点:小巧、方便、功能强大。插件丰富、开源、免费。

JQuery的优点:小巧、方便、功能强大。插件丰富、开源、免费。

3.input标签选择系统文件的问题

在html5中 input标签提供给了开发者访问系统文件的能力。说实话如果仅仅在移动端的系统浏览器中使用input控件真的没有发现什么问题。但是在app的**webview**中却处处是坑。以下是总结出的一些经验。

<input type="file">在webview中访问系统文件遇到的一些问题:

  1. 触发input后,页面“闪退”(现象就是,文件选择框出现后又立马关闭);当初遇到这个问题是在贴吧的客户端中,听贴吧的兄弟说,他们后来做了兼容。
  2. 华为手机中可以正常的呼起系统选择文件的窗口,但是无法正常读取系统文件(最后跟客户端的同学确定,如果h5在webview中读取系统文件,是需要权限的,也就是说需要客户端支持);
  3. 在ios的webview中也会出现问题。如果有兴趣的同学可以参考这篇苹果的开发者文档(点击访问)

详细的可以参考这篇文章一起阅读:《h5端呼起摄像头扫描二维码并解析》

>JavaScript是一种解释性语言,边执行边解释

JQuery文件说明:

JQuery文件说明:

4.传递参数的解决方案

在开发过程曾经遇到过这样的问题:

很多个页面,比如说a-z。当我在a页面的时候,浏览器中的url会带有某些参数,当我在做完一系列的操作到达z页面。
某天有个需求,用户在页面a的时候会带上一个参数,决定用户在z页面做完操作后页面最终跳向哪里。那么这个参数该怎么传递到z页面呢?

第一种解决方案:

a页面到z页面跳转的过程中,通过 GET 的方式在url中带上这个参数;

这种方案是比较常规,也是比较不错的解决方案。但是需要在页面中的逻辑跳都加上需要的参数。这样工作量比较大,而且容易出现遗漏。不建议使用。

第二种解决方案:

使用html5新特性sessionStorage来解决问题。在a页面的时候,把新添加的需要传给z页面的参数放在sessionStorage中。在z页面直接从sessionStorage中取需要获取的参数值,然后决定页面最终的跳转。

这样解决问题不仅减少了很大的工作量,也解决了工作量大会遗漏的问题。

sessionStorage的优点:

因为数据是存储在内存中,当会话结束,页面关闭以后这些数据就会被销毁。

html5移动端存储的一些坑:

当然在移动端浏览器中使用localStoragesessionStorage是没有任何问题的。但是在安卓webview中却出现了localStorage无法向移动的磁盘写数据的问题。最后通过网络搜索发现。在安卓上webview是默认不开启localStorage想磁盘写文件的权限的。所以如果需要使用localStorage的同学需要找客户端支持。详细信息如下:

图片 11

二:JavaScript 由三部分组成

       jquery-1.4.2.js是JQuery主文件。

       jquery-1.4.2.js是JQuery主文件。

5.pc端js生成二维码

做过一个JavaScript生成二维码的需求。当时调研了两个方案:

  1. 使用qrcodejs
  2. 使用jquery.qrcide

在使用的过程中还是遇到一些坑,总结如下:

图片 12

所以在前端有需求做生成二维码需求的时候,可以参考以上的两个点,确定自己选择哪个开源库更适合自己的项目。

ECMAScript标准(它是一个描述,规定了脚本语言的所有属性,方法和对象的标准)
浏览器对象模型(Browser Object Model , BOM)
文档对象模型(Document Object Model ,DOM)

       jquery-1.4.2.min.js是压缩板JQuery主文件。

       jquery-1.4.2.min.js是压缩板JQuery主文件。

6.本地存储js字符串

当看到题目的时候,可能会“一脸蒙逼”为什么要在本地存储js字符串啊。好吧,有时候业务场景的需求确实是比较变态,且看我描述的一个业务场景。

业务场景:
因为历史的原因,我们的html5页面是跑在客户端的webview中,但是客户端的titlebar上的那个返回按钮却是调用了前端js的back方法进行页面返回的。这个时候就会出现一个问题,如果在我们的h5页面中跳出了我们自己的页面,到了第三方的页面。第三方页面的js肯定是没有我们客户端返回按钮需要的js返回方法的。

可能有人会说,“卧槽,为什么要这么搞,当初谁这么设计的。。。”或者是“让客户端同学发版,用客户端自己的返回不就解决问题了么”。

好吧,都说了是历史原因了其它的都不要说,而且找客户端同学发版也不太现实的情况下只能想其它的解决方案了。

之前已经聊到过html5的客户端存储技术sessionStorage。当然我要做的就是把那段前端的back方法存到sessionStorage中。当加载第三方的页面的时候直接从sessionStorage中读取back方法的字符串,转化为js代码,并且赋值给客户端调用的方法。

其实这里的难点是怎么把js字符串转化为可执行的js代码。

  1. 使用eval执行js代码语句,看下面简单的示例:

图片 13

由上面的代码可以知道,eval可以把简单的js字符串转化为js代码并且执行它。但是当我们的js字符串比较复杂呢?比如下面这样:

JavaScript

function aaa(){ console.log(1); }

1
2
3
function aaa(){
    console.log(1);
}

那么使用eval函数还行不行呢?看下面的示例:
图片 14

由上面的执行结果可以知道,不管怎么执行都得不到我们的预期的结果,但是有没有办法得到我们预期的结果呢?答案是:有。

  1. JavaScript中new 关键字的使用

在JavaScript中一切皆是对象。当我们创建一个函数的时候除了函数声明和函数表达式外,还可以通过new Function的方式来创建函数(这种方式并不常用,但是特殊的场景还是很有用的)。

那么使用new Function怎么解决上面的问题呢?请看示例代码:

图片 15

由上面的示例代码和c的执行结果我想很多人已经知道怎么做了,其实只需要对b的字符串函数做一下简单的修改即可,看代码:

图片 16

上面的代码执行结果的b()就是我们我想要的保存的函数体。

三:JavaScript的执行原理

       jquery-1.4.2-vsdoc.js是JQuery在VS中的自动提示功能。

       jquery-1.4.2-vsdoc.js是JQuery在VS中的自动提示功能。

7.绝对定位的“坑”

来看一个比较常见的布局

图片 17

上面的这个布局 因为footer是相对于页面底部绝对定位的,所以当屏幕太小的时候会有一个问题footer区域覆盖了内容区域,如下图:

图片 18

那我们怎么解决这个问题呢?我看到在我们项目的源代码中是通过js给footer和内容区域所在的父容器设置一个最小的高度来解决这个为题的,这样做不好。除了会增加复杂的判断也会造成页面的重绘

JavaScript

var webViewHeight = window.innerHeight; var iosCampatibleValue = 64; if(webViewHeight<500){ webViewHeight =500; } $('#pageWrapper').css('height', webViewHeight);

1
2
3
4
5
6
var webViewHeight = window.innerHeight;
var iosCampatibleValue = 64;
if(webViewHeight<500){
    webViewHeight =500;
}
$('#pageWrapper').css('height', webViewHeight);

很明显上面的代码会造成页面的重绘(当然这个对系统性能消耗并不是那么容易感知)。但是用css可不可以解决这个问题呢?

当然是可以的,就是为内容容器设置一个padding-bottom它的值就是底部footer的高度,如下图:

图片 19

当移动端的屏幕比较低的时候就会是下面的这种情况:

图片 20

padding-bottom和footer重合。但是footer永远不会覆盖内容区域的内容。这时页面会出现滚动条。可能我们最初的设计是为了用户体验不让用户的屏幕出现滚动条,但是还是那句话没有十全十美的程序,在一些小众机型上为了保证页面的正常显示保证用户正常浏览我们只能牺牲一下这样的用户体验了。

1.浏览器客户端向服务器端发送请求:即客户要访问的页面

 

 

8.键盘被呼起模拟滚动

现在大多数的安卓系统和ios系统,当输入框获取焦点呼起系统键盘的时候,系统键盘都会将input输入框给推上键盘的上方,方便用户的输入。但是不外乎例外,特别是在某些app中,这个本身是系统的操作并不生效,这个时候如果需要达到完美的用户体验就需要人为的参与进来。

解决办法:

思路很简单,就是检测输入框的focus事件,当输入框获取焦点的时候,用js去把页面滚动一下。最好维护一个系统无法正常推起输入框的软件列表(可以通过HTTP的UA来获取软件的唯一标识)。如果可以使用系统默认的滚动就用系统的,如果不可以再人为的调用js干预。

JavaScript

function inputScroll(dom){ var tplList=['ss','bb'] ; var tpl = $.fn.getQueryString(tpl); if(tplList.indexOf(tpl)){ dom.focus(function(){ var clientHeight = $(window).height(); var contentHeight = clientHeight clientHeight/2; var smsInputTop= $(this).offset().top; content.height(contentHeight); window.scrollTo(0,smsInputTop-76); }); } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function inputScroll(dom){
var tplList=['ss','bb'] ;
 
var tpl = $.fn.getQueryString(tpl);
    if(tplList.indexOf(tpl)){
        dom.focus(function(){
            var clientHeight = $(window).height();
            var contentHeight = clientHeight clientHeight/2;
            var smsInputTop= $(this).offset().top;
 
            content.height(contentHeight);
            window.scrollTo(0,smsInputTop-76);
            });
    }
}

图片 21

打赏支持我写出更多好文章,谢谢!

打赏作者

2.数据处理:服务器端将某个包含JavaScript的页面进行处理

2.JS的常用方法——函数

2.JS的常用方法——函数

打赏支持我写出更多好文章,谢谢!

任选一种支付方式

图片 22 图片 23

2 赞 13 收藏 1 评论

3.发送响应:服务器端将含有JavaScript的HTML脚本文件处理页面发送到客户端,

在JS中,函数类似于java中的方法,是执行特定功能的JavaScript代码块。但是JS中的函数使用更简单,不用定义函数属于 哪个类,因此调用时不需要用“对象名.方法名()”的方式,直接使用函数名称来调用函数即可。

在JS中,函数类似于java中的方法,是执行特定功能的JavaScript代码块。但是JS中的函数使用更简单,不用定义函数属于 哪个类,因此调用时不需要用“对象名.方法名()”的方式,直接使用函数名称来调用函数即可。

关于作者:zhiqiang21

图片 24

做认为对的事情,如果可能是错的,那就做认为自己承受得起的事情! 个人主页 · 我的文章 · 11 ·      

图片 25

后由浏览器客户端从上往下依次解析HTML标签和JavaScript,并将页面效果呈现给客户

JavaScript中的函数有两种:一种是Javascript自带的系统函数,另一种是用户自行创建的自定义函数

JavaScript中的函数有两种:一种是Javascript自带的系统函数,另一种是用户自行创建的自定义函数

使用客户端脚本的好处:

JavaScript提供了两种把非数字的原始值转换成数字的函数,即parseInt()和parseFloat()。另外,它还提供了一个检查是否是非数字的函数isNaN(),通常用于逻辑判断。

JavaScript提供了两种把非数字的原始值转换成数字的函数,即parseInt()和parseFloat()。另外,它还提供了一个检查是否是非数字的函数isNaN(),通常用于逻辑判断。

包含JavaScript的页面只需要下载一次即可,这样能减少不必要的网络通信

一.parseInt()

一.parseInt()

JavaScript程序由浏览器客户端执行,而不是由服务器端执行,能减少服务器端的压力

parseInt()函数可解析一个字符串,并返回一个整数,语法格式如下:

parseInt()函数可解析一个字符串,并返回一个整数,语法格式如下:

----------------------------------------变量的声明和使用----------------------------------------------
一:JavaScript是一种弱类型语言 ,没有明确的数据类型,但是并不代表没有数据类型!也就是说咋声明变量时
不需要指定变量的类型
在JavaScript中变量的声明都是用var统一声明的 注意!!区分大小写 而且不能是js中的关键字
eg:
var width=20;
var x,y,z=10;
这样声明变量在js中也是合法的,并不会报语法错误
eg:
var num;
var number=
var str=String("12");

parseInt("字符串")

parseInt("字符串")

二:JavaScript中的六大数据类型:

parseInt()函数首先查看位置0处的字符,判断他是否为一个有效数字,如果不是则返回NaN,不再继续执行其他操作。但如果该字符是有效数字,则该函数将查看位置1处的字符,进行同样的测试,这一过程将持续到发现非有效数字的字符为止,此时parseInt()将该字符之前的字符串转换成数字,例如:

parseInt()函数首先查看位置0处的字符,判断他是否为一个有效数字,如果不是则返回NaN,不再继续执行其他操作。但如果该字符是有效数字,则该函数将查看位置1处的字符,进行同样的测试,这一过程将持续到发现非有效数字的字符为止,此时parseInt()将该字符之前的字符串转换成数字,例如:

undefined(未定义类型)
null(空类型)
number(数值类型)
String(字符串类型)
boolean(布尔类型)
Object(数组,函数对象类型)

         var num1=parseInt("78.89")          //返回值为78

         var num1=parseInt("78.89")          //返回值为78

※只有 0 "" undefind null NaN false 是默认为false其他的都默认为true!

         var num2=parseInt("4567color")    //返回值为4567

         var num2=parseInt("4567color")    //返回值为4567

三:String对象的常用方法
toString():返回字符串

         var num3=parseInt("this36")          //返回值为NaN

         var num3=parseInt("this36")          //返回值为NaN

toLowerCase():将字符串转换成小写

 

 

toUpperCase():将字符串转换成大写

实例:

实例:

charAt(index):返回指定位置的字符

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>类型转换函数的应用</title>
</head>
<body>
    <script type="text/javascript">
        var op1 = prompt("请输入第一个数:", "")
        var op2 = prompt("请输入第二个数:", "")
        var p1 = parseInt(op1);
        var p2 = parseInt(op2);
        var result = p1   p2;
        document.write(p1   " "   p2   "="   result);
    </script>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>类型转换函数的应用</title>
</head>
<body>
    <script type="text/javascript">
        var op1 = prompt("请输入第一个数:", "")
        var op2 = prompt("请输入第二个数:", "")
        var p1 = parseInt(op1);
        var p2 = parseInt(op2);
        var result = p1   p2;
        document.write(p1   " "   p2   "="   result);
    </script>
</body>
</html>

indexOf(str,index):查找某个指定的字符串在字符串中首次出现的位置

运行结果如下:

运行结果如下:

substring(index1,index2):返回指定索引index1到index2中的字符串 (前闭后开原则)

图片 26

图片 27

split(str):将字符串根据指定的str分割为字符串数组

二.parseFloat()

二.parseFloat()

四:在JavaScript中 ‘==’和‘===’是不同的意思 ‘==’比较的是值 ‘===’比较的是值和数据类型

parseFloat()函数可解析一个字符串,并返回一个浮点数,语法格式如下。

parseFloat()函数可解析一个字符串,并返回一个浮点数,语法格式如下。

五:typeof()运算符 typeof()是运算符而并不是函数

parseFloat("字符串")

parseFloat("字符串")

typeof()的作用是获取一种变量究竟是那种数据类型

例如:

活动端h5开荒相关内容总计,jquery基础教程。例如:

六:数组
创建数组的方法
var 数组名=new Array(size);
在js中创建数据并赋值有多种方式
eg:
1.var array=new Array();
2.var array=new Array("1","2","3");
3.var array=new Array(2);
活动端h5开荒相关内容总计,jquery基础教程。 array[0]=1;
array[1]=2;
array[5]=6; 注意,在js中是没有数组下标越界这一说法的,其余没有赋值的部分会自动用undefind来填充!
4.var array=["1","2","3"];

          var num1=parseFloat("4567color");         //返回值为4567

          var num1=parseFloat("4567color");         //返回值为4567

七:数组中常用的属性和方法
属性: length 设置或返回数组中的元素的数目
方法: join() 把数组的所有元素放入一个字符串,通过一个分隔符来进行分割连接
sort() 对数组进行排序
push() 向数组末尾添加一个或更多的元素,并返回新的长度

          var num1=parseFloat("45.58");               //返回值为45.58

          var num1=parseFloat("45.58");               //返回值为45.58

八:常用的输入输出(在js中字符串最好使用'' 在HTML中字符串最好使用"")
警告弹框(只有一个确定按钮)

          var num1=parseFloat("45.58.25")            //返回值为45.58

          var num1=parseFloat("45.58.25")            //返回值为45.58

alert('弹出的内容');
提示弹框(可以接受文本)

          var num1=parseFloat("color4567")           //返回值为NaN

          var num1=parseFloat("color4567")           //返回值为NaN

prompt('提示信息","输入框的默认信息') 注:要默认输入框没有内容可将第二个参数设置为"",在IE浏览器中如果没有设置第二个属性则输入框中显示undefind其他浏览器则不显示内容
确认取消框(返回true 或false)

 

 

confirm('显示的文本')

三.isNaN()

三.isNaN()

九:JavaScript中常用的语法--函数
常用的系统函数:
isNaN() :用来判断一个变量是否是非数值类型 若是非数值类型则返回true 若不是非数值类型则返回flase
eg:
var flag1=isNaN("12.5"); //返回值是 false
var flag2=isNaN("12.5s"); //返回值是 true
var flag3=isNaN("45.8"); //返回值是 false
var flag4=isNaN(.45); //返回值是 false 会自动补全为0.45
var flag5=isNaN(5/0); //返回值是Infinity 表示无限大小的数据

isNaN()函数用于检查其参数是否是非数字,语法格式如下:

isNaN()函数用于检查其参数是否是非数字,语法格式如下:

parseInt() :可解析一个字符串返回一个整数
eg:
parseInt('78.89'); //返回78
parseInt('4567adsh');//返回4567
parseInt('this36'); //返回NaN(not a number)

isNaN(x)

isNaN(x)

parseFloat():可解析一个字符串返回一个浮点数
eg:
parseFloat('4567sdas'); //返回值为4567

如果x是特殊的非数字值,则返回值是true,否则返回false。例如:

如果x是特殊的非数字值,则返回值是true,否则返回false。例如:

parseFloat('45.58');//返回值为45.58

    var flag1=isNaN("12.5");                //返回值为false

    var flag1=isNaN("12.5");                //返回值为false

parseFloat('cloas785');//返回为NaN
parseFloat('.45'); //返回值为0.45

    var flag2=isNaN("12.5s")                //返回值为true

    var flag2=isNaN("12.5s")                //返回值为true

自定义函数

    var flag3=isNaN(45.8)                    //返回值为false

    var flag3=isNaN(45.8)                    //返回值为false

自定义函数用关键字function
eg:
funtion 函数名(参数1,参数2,参数3){
[return 返回值]
}
匿名函数
function(){ //是没有名字的,一般用变量接收 掉用时直接调用变量名就成
....
}

 

 

2.自定义函数

2.自定义函数

语法:

语法:

         function函数名(参数1,参数2,参数3,.......){

         function函数名(参数1,参数2,参数3,.......){

               //JavaScript语句;

               //JavaScript语句;

               [return 返回值]

               [return 返回值]

         }

         }

function是定义函数的关键字,必须有。

function是定义函数的关键字,必须有。

一.调用函数:

一.调用函数:

要执行一个函数,必须先调用这个函数,当调用函数时,必须指定函数名及其后名的参数(如果有参数)。函数的调用一般和元素的事件结合使用,语法格式如下:

要执行一个函数,必须先调用这个函数,当调用函数时,必须指定函数名及其后名的参数(如果有参数)。函数的调用一般和元素的事件结合使用,语法格式如下:

      事件名="函数名()";

      事件名="函数名()";

实例:

实例:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无参函数——使用函数显示Hello World多次</title>
    <script type="text/javascript">
        function showHello() {
            for (var i = 0; i < 5; i  ) {
                document.write("<h2>Hello World</h2>");
            }
        }
    </script>
</head>
<body>
    <input type="button"  name="btn" value="显示5次HelloWorld" onclick="showHello()"/>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>无参函数——使用函数显示Hello World多次</title>
    <script type="text/javascript">
        function showHello() {
            for (var i = 0; i < 5; i  ) {
                document.write("<h2>Hello World</h2>");
            }
        }
    </script>
</head>
<body>
    <input type="button"  name="btn" value="显示5次HelloWorld" onclick="showHello()"/>
</body>
</html>

运行结果:

运行结果:

图片 28

图片 29

图片 30

图片 31

3.匿名函数

3.匿名函数

一.匿名函数的定义

一.匿名函数的定义

    匿名函数是没有函数名的。如下:

    匿名函数是没有函数名的。如下:

         function (count){

         function (count){

                for(var i = 0;i<count;i ){

                for(var i = 0;i<count;i ){

                      document.write("<h2>Hello World</h2>");

                      document.write("<h2>Hello World</h2>");

                }

                }

         }

         }

 

 

二.匿名函数的调用

二.匿名函数的调用

实例:

实例:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>使用匿名函数显示</title>
    <script type="text/javascript">
        var showFun = function (count) {
            for (var i = 0; i < count; i  ) {
                document.write("<h2>Hello World</h2>")
            }
        };
    </script>
</head>
<body>
    <input type="button" name="btn" value="请输入显示Hello World的次数" onclick="showFun(prompt('请输入显示Hello World的次数:',''))"/>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>使用匿名函数显示</title>
    <script type="text/javascript">
        var showFun = function (count) {
            for (var i = 0; i < count; i  ) {
                document.write("<h2>Hello World</h2>")
            }
        };
    </script>
</head>
<body>
    <input type="button" name="btn" value="请输入显示Hello World的次数" onclick="showFun(prompt('请输入显示Hello World的次数:',''))"/>
</body>
</html>

运行结果:

运行结果:

图片 32

图片 33

图片 34

图片 35

本文由澳门新萄京官方网站发布于澳门新萄京赌场网址,转载请注明出处:活动端h5开荒相关内容总计,jquery基础教程

关键词: