在Html基础上，javascript能够开发交互式web网页。javascript的出现使得网页和用户之间实现了一种实时性的、动态的、交互性的关系，javascript短小精悍，又是在客户机上执行的。大大提高了网页的浏览速度和交互能力。同一时候它又是专门为制作web网页而量身定做的一种简单的编程语言。

  1. Javascript:一种脚本语言(scripting
    language),或称描写叙述性语言。
  1. 主要用途在表单验证：大多数是通过弹出对话框来与用户交互的
  2. 在程序执行过程中逐行地进行解释，是一种解释性语言。
  1. 解释性语言：边执行,边编译
  2. 编译性语言：借助之前的运行过程以增强当次运行的效率
  1. 基于对象的语言：javascript是一种基于对象的语言，同一时候也能够看做一种面向对象的语言。这意味着它能运用自己已经创建的对象。

    因此，很多功能能够来自于脚本环境中对象的方法与脚本的相互作用

  1. 变量类型是弱类型，并未使用严格的数据类型
  2. javascript是一种安全性语言。它不同意訪问本地硬盘，并不能数据存数到server上。不同意对网络文档进行改动和删除，仅仅能通过浏览器实现信息浏览或动态交互。从而有效防止数据的丢失。

  1. javascript是依赖于浏览器本身，与操作环境无关。仅仅要能执行浏览器的计算机，并支持javascript的浏览器就能够正确执行
  1. javascript的两大机制：面向对象，事件处理机制。

    举一个Javascript的小样例

    <!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=utf-8" />
    
<title>博客小样例</title>
    
<style type="text/css">

#btnLogin, #btnExit{
    
	width:70px;
    
	height:30px;
    
	font-family:幼圆;
    
	font-weight:bold;
    
	font-size:18px;
    
	}

#form1 p strong {
    
	font-family: "幼圆";
    
	font-size:18px;
    
}

#txtUserPwd, #txtUserName
    
{
    
	width:200px;
    
	height:25px;
    
	font-family:幼圆;
    
	font:bold;
    
	font-size:18px;}

#usermessagee
    
{
    
	border-width:0px;}

#form1
    
{
    
	alignment-adjust:middle;

	}
    
</style>

</head>
    
<body>
    
<center>

    <form id="form1" name="form1" method="post" action="http://blog.csdn.net/tgbsqliuying" >

      <p><strong>用户名：</strong>
    
        <input type="text" name="txtUserName" id="txtUserName" />
    
      </p>
    
      <p><strong> 密　码：</strong>
    
        <input type="text" name="txtUserPwd" id="txtUserPwd" />
    
      </p>

      <p> 　　　　　
    
          　//利用onclick实现事件驱动　　　　　　　　　　　　　　　　
    
          <input type="button" name="btnLogin" id="btnLogin"  value="登陆"  onclick="LogIn()"/>
    
      </p>

    </form>

</center>
    
</body>

</html>
    
<script language="javascript" type="text/javascript">
    
	function LogIn()
    
	{

			//顺序结构（用keywordvar声明keyword，说明javascript是弱数据类型）
    
			var username=document.form1.txtUserName.value;
    
			var userpwd=document.form1.txtUserPwd.value;
    
			if(username==""||username=="")//选择结构
    
			{
    
				alert("用户名不能为空。");
    
				document.form1.txtUserName.focus();
    
				return;
    
				}
    
			//利用正則表達式推断输入的用户名是否正确
    
			var reg=/^[\u4E00-\u9FA5\uF900-\uFA2D\w]+$/g;
    
			if(!reg.test(username))
    
			{
    
				alert("用户名格式不对。请从新输入");
    
				return;
    
				}

			if (userpwd==""||username=="")
    
			{
    
				alert("password不能为空！

");
    
				document.form1.txtUserPwd.focus();
    
				return;
    
				}

			//利用正則表達式推断输入的password是否正确
    
			reg=/^[\u4E00-\u9FA5\uF900-\uFA2D\w]+$/g;
    
			if(!reg.test(userpwd))
    
			{
    
				alert("password格式不对！请从新输入");
    
				return;
    
				}

			document.form1.submit();	

	}

</script>

    相信以后的学习会对Javascript有更深的理解

静态网页怎样实现动态交互?-JavaScript的更多相关文章

  1. 静态网页VS动态网页

    干<沙朗新闻发布系统>什么时候.我们已经建立的网页.html的,并且.aspx,第一次接触.我认为这些东西是一样的,因为它,在观看ASP.NET视频的时候.听见里面讲课的老师有提到了这两样 ...

  2. 如何用phpcms将静态网页生成动态网页？

    在前两篇随笔中已经简单介绍了phpcms,那么现在让我们来看一下如何用phpcms将静态网页生成动态网页? 1.在templates文件夹下新建模板文件夹ceshi(名字可以自己随笔起) 2.在ces ...

  3. 【js】使用javascript 实现静态网页分页效果

    <!DOCTYPE html> <html> <head> <meta http-equiv="content-Type" content ...

  4. 静态网页、动态网页、apache和tomcat之间区别和联系

    1.静态网页 静态网页:在网站设计中, 纯粹的HTML(标准通用标志语言下的一个应用)格式的网页通常被称为"静态网页",静态网页是标准的HTML文件,它的拓拓展名是.html或者. ...

  5. SpringBoot-(2)-Web的json接口,静态网页,动态页面

    一, 了解注解@Controller和@RestController @Controller:处理Http请求 @RestController:Spring4以后新增注解,相当于@Controller ...

  6. Spring Security自定义认证页面（动态网页解决方案+静态网页解决方案）--练气中期圆满

    写在前面 上一回我们简单分析了spring security拦截器链的加载流程,我们还有一些简单的问题没有解决.如何自定义登录页面?如何通过数据库获取用户权限信息? 今天主要解决如何配置自定义认证页面 ...

  7. iOS中动态注入JavaScript方法。动态给html标签添加事件

    项目中有这样一种需求,给html5网页中图片添加点击事件,并且弹出弹出点击的对应的图片,并且可以保持图片到本地 应对这样的需求你可能会想到很多方法来实现. 1. 最简单的方法就是在html5中添加图片 ...

  8. 用JSP实现动态交互

    一.什么是JSP? 1.在HTML中嵌入Java脚本代码 2.由应用服务器中的JSP引擎来编译和执行嵌入的Java脚本代码 3.然后将生成的整个页面信息返回给客户端   二.为什么需要基于B/S技术的 ...

  9. Java Web开发技术教程入门-静态网页技术

        昨天了解了构建动态网站的几种技术:Servlet技术.JSP技术,ASP技术和ASP.NET技术以及PHP技术.昨天的精髓在于JSP技术的运行原理:通过用户请求JSP文件,首先检查JSP文件的 ...

随机推荐

  1. redis.conf介绍

    默认配置文件: # Redis configuration file example. # # Note that in order to read the configuration file, R ...

  2. Java数据结构和算法(四)--链表

    日常开发中,数组和集合使用的很多,而数组的无序插入和删除效率都是偏低的,这点在学习ArrayList源码的时候就知道了,因为需要把要 插入索引后面的所以元素全部后移一位. 而本文会详细讲解链表,可以解 ...

  3. 编写一个函数，输入n为偶数时，调用函数求1/2+1/4+...+1/n,当输入n为奇数时，调用函数1/1+1/3+...+1/n(利用指针函数)

    *题目:编写一个函数,输入n为偶数时,调用函数求1/2+1/4+...+1/n,当输入n为奇数时,调用函数1/1+1/3+...+1/n(利用指针函数) public class 第三十九题按条件计算 ...

  4. FFT NTT 模板

    NTT: #include<cstdio> #include<cstring> #include<algorithm> using namespace std; # ...

  5. mysql两种常用备份工具

    一.mysqldump备份: 在开启GTID模式时,在master上执行的备份: --set-gtid-purged=OFF 在开启GTID模式时,要在slave上执行,想重新搭建一套slave环境. ...

  6. linux find的用法

    ①.一般格式: ·find   path   -option   [   -print ]   [ -exec   -ok   command ]   {} \; 说明: #-print 将查找到的文 ...

  7. python蛋疼的编码decode、encode、unicode、str、byte的问题都在这了

    相信很多人和我一样,被python蛋疼的编码问题纠缠不清,比如下面的 私以为出现这种错误的原因还是对一些基本的编解码概念不够熟悉,下面就说说我的理解: 首先python刚出来的时候unicode还没有 ...

  8. Codeforces474E - Pillars

    Portal Description 给出一个\(n(n\leq10^5)\)的正整数序列\(\{a_n\}(a_i\leq10^{15})\)和正整数\(d(d\leq10^9)\),求\(\{a_ ...

  9. 新版VS-code如何自动换行？

    文件  -> 首选项 -> 设置 -> 编辑器 找到 // 控制折行方式.可以选择: - "off" (禁用折行), - "on" (视区折行 ...

  10. Request获取Session的两种方式

    1.无请求参数 public HttpSession getSession() 获取当前request关联的session,如果当前request没有session,创建一个session. 2.有请 ...