html中的JavaScript_夜·封尘的博客-程序员宅基地_html js

技术标签: js  javascript  

JavaScript ——简介

JavaScript 是目前最流行脚本语言,简称 JS。JavaScript 编写在 HTML 页面中,由浏览器负责解释和执行,JavaScript 通常用来给 HTML 页面增加交互能力。
 
JS可以给html带来的功能:
为页面增加动画效果
验证表单输入项有效性
实现本地数据存储

 

html、CSS和JS之间的关系

JS的语言应用——内嵌/内部/外部

在html中,可以通过以下三种方法来应用JS:

1. 内嵌式:又称行内式,在HTML标签上编写JS,如: <button οnclick="alert('你好 JavaScript');">Hello!JavaScript</button>
 
<html>
<head>
    <meta charset="UTF-8">
    <title>JS</title>
</head>
<body>

<button onclick="alert('你好 JS');">Hello JS</button>  
  
</body>
</html>
2. 内部式:在HTML页面中的script标签中编写JS,如:<script>...</ script >
 
<html>
<head>
    <meta charset="UTF-8">
    <title>JS</title>

    <script type="text/javascript">    	
        alert(“你好 JS”);    
    </script>

</head>
<body>
</body>
</html>
 
3. 外部式:在HTML页面中引入外部JS文件,如:<script src=“xx.js"></ script >

 

<html>
<head>
    <meta charset="UTF-8">
    <title>JS</title>
</head>
<body>
    <script src="main.js"></script>
</body>
</html>

这个要在main.js文件中加入语句  alert(“你好 JS”);     才能运行。

JavaScript 变量——存储数据信息的“容器”

JS对变量定义比较特殊,使用var来进行定义,如:var name=“hello”;

命名规则:

1.变量名只能包含:字母、数字、下划线( _ )
2.不能以数字开头
3.不能使用JS关键字
4.变量名区分大小写,下面是两个不同的变量

var name=“学习”;

var Name=“XueXi” ;

<script type=“text/javascript”>        
    var age=21;
    var phone1=“13800000000”;
    var my_address=“YunNan”;
    
    x=5,y=10;

</script>

JS中定义多个变量利用逗号 , 分割,如:var name=“张三”,age,phone;

 

JS关键字

JS关键字又称“Js保留字”,不能用作变量名或者函数名,以下是部分保留字列表:

abstract

arguments

boolean 

break

byte

case

catch

char

class*

const

continue

debugger

default

delete

do

double

else

enum*

eval

export*

extends*

false

final

finally

float

for

function

goto

if

implements

import*

in

instanceof

int

interface

let

long

native

new

null

package

private

protected

public

 

JavaScript 中的6种数据类型

1. 字符串 String
  var name = “张三”;  // 字符串(单引号或双引号)
 
2. 数字 Number)
var age = 20;  // 数字
 
3. Boolean
var isFirst = true; // 布尔( true 或 false )
 
4. 对象 Object
var company = new Object(); // 对象
 
5. Null
var address = null; // 空
 
6. 未定义 Undefined
var phone; // 未定义

 

我们可以利用JavaScript内置函数typeof 判断数据类型。

JS动态类型

JS拥有动态类型特征,这意味着相同的变量可以用来存储不同的类型值,也就是说,JavaScript中的变量,可以根据其存储的值,动态改变其变量类型

<script type=“text/javascript”>        
    var x;  // x 为未定义类型 undefined
    x = 20;  // 现在 x 为数字类型 number
    x = “Hello”; // 现在 x 为字符串类型 string
</script>

JS注释

注释不会被执行,但可以提高代码的可读性或方便调试。在JS中,注释的编写有两种方式:一种是单行注释,一种是多种注释

<script type=“text/javascript”>        
    var name = “张三”;  // 姓名
    /* 
     x初始值必须为 20
     如果大于20则… 
     */
    var x = 20
</script>

调试时可以将暂时不用的部分注释掉,待调试完后去掉注释符号即可

<script type=“text/javascript”>
   var y = 30;
   // y = y + 100; 
  /*
    var x = 25;
     y = x + 80;
   */       
</script>

如有帮助,可以留下一个免费的赞支持一下,感激不尽!

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/qq_49032349/article/details/117660519

智能推荐

知识表示学习常用数据集_天雨龙马的博客-程序员宅基地_知识表示的数据集

WN11WN11所包含的11种关系 出处(SE) Bordes A, Weston J, Collobert R, et al. Learning Structured Embeddings of Knowledge Bases[C]//AAAI. 2011, 6(1): 6. PDF 特点 As WordNet is composed ...

android录制amr音频文件,android – 以AMR文件格式录制音频_weixin_39923137的博客-程序员宅基地

我想以AMR文件格式录制音频.我目前正在使用波纹管代码来录制音频:outputFile = Environment.getExternalStorageDirectory().getAbsolutePath() + "Sample.3gp";myRecorder = new MediaRecorder();myRecorder.setAudioSource(MediaRecorder.AudioS...

SAP License:SAP学习心得_SAP权限管控的博客-程序员宅基地

1、组织架构–用途:责任、统计、数据分类、数据关联、关键字。2、SAP应用技巧–功能/元素对应业务项/ 点,预提升业务则需启用功能或补录数据项。3、SAP系统概念业务释义手册,业务单据关键字段清单及描述。4、系统可以多项集成,形成多个口径,提供多维管理视图,但统计口经必须选其一、必须唯一一致;如成本中心可与设备位置之工作中心集成,也可与设备组织结构之成本中心。5、SAP是飞机、一般企业能玩得转、用的上么;需要的是顾问的艺术、管理者的决心。6、主数据及业务表单各数据字段业务含义及系统作用影响描述;.

java 崩溃日志,minecraft崩溃日志_发条粽子的博客-程序员宅基地

该楼层疑似违规已被系统折叠隐藏此楼查看此楼可以帮我看看吗-- Head --Thread: Client threadStacktrace:at java.lang.Class.forName0(Native Method)at java.lang.Class.forName(Unknown Source)at net.minecraftforge.fml.common.FMLModContai...

BigDecimal除法保留小数位_兴趣使然的小小的博客-程序员宅基地_bigdecimal除法保留小数点

BigDecimal num1 = new BigDecimal(100);BigDecimal num2 = new BigDecimal(32);System.out.print(num1.divide(num2, 2, RoundingMode.HALF_UP));RoundingMode.DOWN 直接删除多余的小数位,如2.35会变成2.3RoundingMode.UP 进位处理,2.35变成2.4RoundingMode.HALF_UP 四舍五入,2.35变成2.4Rounding

NotePad++ 语法高亮 INC 文件_weixin_33947521的博客-程序员宅基地

2019独角兽企业重金招聘Python工程师标准&gt;&gt;&gt; ...

随便推点

python绘制直方图显示数字_Python实现绘制双柱状图并显示数值功能示例_weixin_39943383的博客-程序员宅基地

本文实例讲述了Python实现绘制双柱状图并显示数值功能。分享给大家供大家参考,具体如下:# -*- coding:utf-8 -*-#! python3import matplotlib.pyplot as pltimport mpl_toolkits.mplot3d#定义函数来显示柱状上的数值def autolabel(rects):for rect in rects:height = rec...

Ruby Web实时消息后台服务器推送技术---GoEasy_weixin_34221773的博客-程序员宅基地

越来越多的项目需要用到实时消息的推送与接收,怎样用Ruby实现最方便呢?我这里推荐大家使用GoEasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送!浏览器兼容性:GoEasy推送 支持websocket 和polling两种连接方式,从而可以支持IE6及其以上的所有版本,同时还支持其它浏览器诸如Firefox, Chrome, Safari等等。支持不同的开发语言:...

JVM内存管理和JVM垃圾回收机制_完美灬缺陷的博客-程序员宅基地

你对JVM内存组成结构和JVM垃圾回收机制是否熟悉,这里和大家简单分享一下,希望对你的学习有所帮助,首先来看一下JVM内存结构,它是由堆、栈、本地方法栈、方法区等部分组成,结构图如下所示。JVM学习笔记 JVM内存管理和JVM垃圾回收JVM内存组成结构JVM内存结构由堆、栈、本地方法栈、方法区等部分组成,结构图如下所示: 1)堆所有通过new

sratookit_weixin_30580341的博客-程序员宅基地

sratookit下载后解压tar -zxvf sratoolkit.2.8.2-1-ubuntu64.tar.gz移动到专门安装生物信息软件的目录下mv sratoolkit.2.8.2-1-ubuntu64 ~/biosoft加入环境变量echo 'PATH=$PATH:~/biosoft/sratoolkit.2.8.2-1-ubuntu64/bin' &g...

孕妇应该怎么吃?_weixin_30654583的博客-程序员宅基地

特别推荐:孕中期作好营养补充 孕期营养过剩对母婴都不好PART1 三阶段补充营养原则孕早期大多数孕妇在孕早期会出现恶心、呕吐、食欲不振等妊娠反应,吃什么都不香,这种状况下,营养的摄入怎样能得以保证呢?处于孕早期的准妈妈大多受妊娠反应困扰,胃口不佳,这个阶段,准妈妈并不用刻意让自己多吃些什么,与其每天对着鸡鸭鱼肉发愁,不如多选择自己喜欢的食物,以增进食欲。对于...

推荐文章

热门文章

相关标签