python web py入门(57)- jQuery - 多个JS代码的文件

原创 2018年04月15日 19:19:56
在前面学习了HTML与JS代码分离的功能,但是会随着项目功能的增加,或者随着时间的增加,维护了代码,新增加的代码不想影响旧的代码,必然会增加更多的JS代码文件。这样多个JS文件是怎么样调用的顺序呢?能不能随便地放置位置呢?依赖的关系是否很复杂?当很多模块代码时,加载页面速度是否会变慢?问题还是很多的,后面再来一一破解。先来看看怎么样分成多个JS文件,以及文件加载的顺序。为此,创建一个add.js文件,它的代码如下:
alert("add.js法函数功能");
function add(s){
  alert(s);
}
创建一个sum.js文件,代码如下:
alert("sum.js累加函数功能");
function sum(s){
  alert(s);
  //这里调用add.js文件的函数
  add("add:1+2");
}


修改checkemail.js文件,在这里调用sum.js里的代码,如下:
$(document).ready(function(){
  var bd = {
        bind :  function(input_element, tip_element, validate_func, null_tip, invalid_tip) {
          var result = new Object();
          result.valid = false;
          // 为input_element绑定blur事件
          $(input_element).blur(function() {
              var input_val = input_element.val();
              if (input_val == "") {
                  result.valid = false;
                  $(tip_element).html(null_tip);
              } else if (!validate_func(input_val)) {
                  result.valid = false;
                  $(tip_element).html(invalid_tip);
              } else {
                  result.valid = true;
                  $(tip_element).html("");
              }
          });

          return result;
        }
  };
  //测试一下对象运行
  var ret = bd.bind($("form#register #email"),
    $("form#register #email").next(),
    function(val) {return val.match(/^([.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/);},
    "< 请输入邮箱",
    "< 邮箱格式不对"
  );
  //这里调用sum.js文件
  sum("sum:3");
  console.log(ret);
});



通过运行,可以发现会按这个顺序先加载:
    <script type="text/JavaScript" src="jquery/jquery-3.3.1.js"></script>
    <script type="text/JavaScript" src= "app/add.js"></script>
    <script type="text/JavaScript" src= "app/sum.js"></script>
    <script type="text/JavaScript" src= "app/checkemail.js"></script>
也就是说,满足下面条件:
假设条件是:JS(A)要调用JS(B)的函数.那么要满足以下条件:
1.要保证你所调用的JS必须在同一个页面里. 也就是JS(A)和JS(B)都要在页面X里.
2.要保证你所调用的JS先于调用者本身被解释.也就是JS(B)要先于JS(A)被解释.反映在页面上,就是JS(B)要写到JS(A)的前面.
3.要保证所调用的JS必须是同一个字符集下.这里有两层意思,一个是引用的JS文件的编码字符集要一样,还一个是嵌入HTML的JS标签属性charset也要一样.


运行的结果如下:





在VC2015里使用protobuf协议
http://edu.csdn.net/course/detail/2582
在VC2015里学会使用MySQL数据库
http://edu.csdn.net/course/detail/2672



版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/caimouse/article/details/79952037

python web py入门(33)- 在HTML网页里嵌入JavaScript脚本

在前面已经学习过在浏览器的console运行JS,那么在网页里又是怎么样运行JS的呢?如果不明白这个,就要跟着本节课来学习了,其实还是蛮简单的。对了,前面已经编辑了一个比较小的网页,并保存成文件了。就...
  • caimouse
  • caimouse
  • 2018-03-20 17:40:40
  • 223

python 调用js中的方法

先上代码: import execjs #执行本地的js def get_js(): # f = open("D:/WorkSpace/MyWorkSpace/jsdemo/js/des_r...
  • FengHuaJianShi
  • FengHuaJianShi
  • 2017-06-06 15:27:07
  • 11668

python搭建web全栈

一个Python服务器和一个React前端
  • shuifu1988
  • shuifu1988
  • 2017-09-12 09:20:13
  • 571

python搭建本地服务器

为什么要搭建服务器?在进行JavaScript开发或一些可视化工作的时候,搭建服务器是必不可少的。作为穷学生党,不可能去购置一台价格昂贵的服务器,只能选择阿里云或其他平台的云服务器,但是每月需要一定的...
  • wr339988
  • wr339988
  • 2016-11-29 20:21:34
  • 1938

Python 删除.py文件

  • 2017年11月22日 11:20
  • 697B
  • 下载

python多个模块py文件的数据共享

模块a.py 想用 b.py中公有数据 cnt b的python文件 #!/usr/bin/env python # coding:utf8 from wx import CallAft...
  • zbo1301
  • zbo1301
  • 2017-03-22 19:26:49
  • 410

使用python生成本地html文件

一.静态HTML生成方法#coding:utf-8 _author_ = "LiaoPan" _time_ = "2016.6.16"f = open("demo_1.html",'w') mess...
  • reallocing1
  • reallocing1
  • 2016-06-16 22:34:02
  • 17854

websocekt-python与Js交互(1)

下载了一个websocket的demo,tcp流式socket,发现代码中,服务端有发送请求头的代码,就想着是不是两端都要遵循着三次握手的原则,就好顿查。以下是知识科普,补一补忘掉的只是,代码在下一章...
  • PrayAllForYou
  • PrayAllForYou
  • 2016-12-01 15:39:01
  • 2142

python顺序执行多个py文件

假如我要执行code目录下的python程序,假设该目录下有1.py,2.py,3.py,4.py四个文件,但是我想执行1.py,2.py,4.py,则可在该目录下创建一个python文件,代码如下:...
  • liusarazhang
  • liusarazhang
  • 2017-12-28 11:49:07
  • 2386

web.py服务端,jquery ajax简单例子

在服务端设置好url映射后编写应对客户端的ajax post请求(新手整理思路记录用,若有错误还请指出~ class AjaxFriendReq: def POST(self): ...
  • qq_24714469
  • qq_24714469
  • 2016-01-29 16:29:10
  • 1661
收藏助手
不良信息举报
您举报文章:python web py入门(57)- jQuery - 多个JS代码的文件
举报原因:
原因补充:

(最多只允许输入30个字)