JavaScript基础知识

JavaScript是目前Web应用程序开发者使用最广泛的客户端脚本文件编程语言之一,它不仅可用来开发交互式的Web页面,更重要的是它将HTML 、XML 、Ajax和Java  Applet等功能强大的Web对象有机结合起来,是开发人员能快速生成Internet或Interanet上使用的分布式应用程序。

JavaScript有什么作用:

JavaScript它除了实现普通的表单验证外还可以制作各种漂亮的页面特效,越来越多的网页使用了这一脚本语言。

Js基础知识

1.1基本概念

HTML负责呈现什么内容。

 css负责以何种方式来呈现。

HTML+CSS:实现了静态页面。

实际上,我们更多的页面的要求是动态的,比如说新浪微博

热点、聚焦…..页面的自动切换。

还有验证码、注册页面的数据验证

那么怎么才能让页面动起来呢?

答案就是JavaScript!

   <style>
        p{
            color:red;
        }
    </style>
</head>

<body>
      <p id="time">今天是......</p>
</body>
<script>
    var p1=document.getElementById("time")
        p1.innerHTML=new Date().toString()
</script>

很明显,这个内容不是HTML提供的,而是由js动态生成的所以js是实现动态页面的,即页面的行为。

 

 

<style>
        #div1{
            height:100px;
            width:100px;
            background:skyblue;
            margin:0 auto;
        }
    </style>
</head>
<body>
<div id="div1" ></div>
</body>
<script language="javascript">
    var timer = setInterval("zoom()",50);
    var div = document.getElementById("div1");
    var timer;
    var width = 100;
    function zoom(){
        if(width >= 600){
            clearTimeout(timer);
        }
        width= width + 5;
        div.style.width =width + "px";
    }
</script>

定时器动态改变元素的宽度,从而实现了动态效果

作业:

(1)      使用定时器显示动态的时间,形如 10:00:21.

(2)      修改第二个案例,实现方块颜色的渐变。

怎么用?

两种方式:

(1)      内部引用,使用<script>标签,代码直接写在标签里

(2)      外部引用,

<script src="E103-01-01.js"></script>

(3)       

<script>

 

作业:

总结html、css和js注释方式,并说明注释的作用

Js是一种解释性语言

计算机语言分为编译型和解释型

程序员使用高级语言来编程,但是程序最终是由计算机去执行,但是计算机是能执行机器语言(即二进制代码),那么这个过程必然有一个从高级语言到机器语言的“翻译”过程。

有两种“翻译”方式:

(1)      编译:将代码整体翻译成机器代码,如果有错误则停止翻译,全部成功翻译完才能执行;

(2)      解释:将代码翻译一条马上执行一条,如果遇到错误则停止。

 

 

Javascriptr的备注方式:1 // 单行注释

                     2 /* 注释内容*/多行注释

 

计算机语言分为两种:编译型语言: java、c++、c、php……

                    解释型语言:JavaScript、css……

HTML:负责呈现的内容。

CSS:负责内容呈现的方式。

JavaScript:负责内容里的行为。

1.2两种引用方式

Js书写在<script>里 内部

用<script src=”路径”> 外部引用


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值