zoukankan      html  css  js  c++  java
  • 静态网页怎样实现动态交互?-JavaScript

    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{
      	70px;
      	height:30px;
      	font-family:幼圆;
      	font-weight:bold;
      	font-size:18px;
      	}
      
      #form1 p strong {
      	font-family: "幼圆";
      	font-size:18px;
      }
      
      #txtUserPwd, #txtUserName
      {
      	200px;
      	height:25px;
      	font-family:幼圆;
      	font:bold;
      	font-size:18px;}
      
      #usermessagee
      {
      	border-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-u9FA5uF900-uFA2Dw]+$/g;
      			if(!reg.test(username))
      			{
      				alert("用户名格式不对。请从新输入");
      				return;
      				}
      				
      			if (userpwd==""||username=="")
      			{
      				alert("password不能为空!

      "); document.form1.txtUserPwd.focus(); return; } //利用正則表達式推断输入的password是否正确 reg=/^[u4E00-u9FA5uF900-uFA2Dw]+$/g; if(!reg.test(userpwd)) { alert("password格式不对!请从新输入"); return; } document.form1.submit(); } </script>


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

  • 相关阅读:
    linux sysfs (2)
    微软——助您启动云的力量网络虚拟盛会
    Windows Azure入门教学系列 全面更新啦!
    与Advanced Telemetry创始人兼 CTO, Tom Naylor的访谈
    Windows Azure AppFabric概述
    Windows Azure Extra Small Instances Public Beta版本发布
    DataMarket 一月内容更新
    和Steve, Wade 一起学习如何使用Windows Azure Startup Tasks
    现实世界的Windows Azure:与eCraft的 Nicklas Andersson(CTO),Peter Löfgren(项目经理)以及Jörgen Westerling(CCO)的访谈
    正确使用Windows Azure 中的VM Role
  • 原文地址:https://www.cnblogs.com/mfmdaoyou/p/7202127.html
Copyright © 2011-2022 走看看