Web前端：JavaScript与HTML—你应该知道的基本区别

　HTML、CSS、Javascript是前端Web开发的主要语言，但是学生们经常混淆Javascript和HTML。因此，今天我们在这里讨论这两种最重要的编程语言之间的差异。

　　Javascript简介

　　Javascript 是一种基于文本的编程语言，主要用于Web开发。它是WWW(万维网)的核心技术之一。

　　通过使用 Javascript，程序员可以创建交互式和响应式Web元素并增强网站的UI。Javascript 在客户端Web开发中非常流行，以至于互联网上超过97%的网站都将其用于客户端行为。弹出窗口、图像滑块、站点导航菜单、选项卡、表单验证是用于Web开发的Javascript的一些示例。

　　HTML简介

　　HTML是超文本标记语言的首字母缩写，它是用于创建网页和Web应用程序的标准标记语言。HTML描述了网页的结构，浏览器从服务器接收HTML页面，然后将文档呈现到屏幕上。

　　HTML包含多个元素，这些元素告诉浏览器内容的外观。例如，<p>标签定义了一个段落，<title>定义了web文档的标题，<body>定义了可见的页面内容，<table>定义了一个表格等等。HTML可以嵌入脚本程序如JS程序会影响网页的内容和行为。此外，它可以包含 CSS(层叠样式表)来改善网页的布局和外观。

　　Javascript与HTML：主要区别是什么?

　　句法

　　HTML是一种标记语言，它有多种标签，如表格标签、换行标签、图片标签、标题标签等。同时，Javascript具有不同的功能，可以使网页具有交互性和动态性。HTML语法更容易学习和理解。与HTML相比，Javascript是一种复杂的语言。

　　动态规划

　　Javascript使网站动态化，它可以更改用户操作的HTML标记的值和属性，它主要包含在HTML代码中以制作交互式网页。

　　另一方面，仅HTML无法制作动态网页，因此，无法动态更改代码。程序员可以在HTML代码中包含Javascript来制作动态网页。

　　兼容性

　　兼容性是Javascript与HTML的主要关注问题之一。每个浏览器都支持HTML，它的标签可以在每个浏览器上毫无问题地呈现，但是，Javascript并不总是与每个浏览器兼容。

　　例如，一些Javascript函数在Chrome或Firefox中运行良好，但在Internet Explorer 中运行不佳，这就是为什么一些网站提到兼容浏览器列表以确保在客户端浏览器中正确查看网站。

　　客户端和服务器端Web开发

　　HTML用于对网页的客户端进行编码，程序员不能使用它来编写服务器端代码。相比之下，Javascript可以在网站的客户端和服务器端使用，服务器端 Javascript(SSJS)是核心javascript的扩展版本。

　　例如，NodeJS是一个开源和跨平台的Javascript运行时环境，允许程序员使用 javascript编写服务器端代码。在NodeJS的帮助下，Javascript代码可以在浏览器之外运行。

　　JavaScript与HTML的比较

　　总结

　　我们已经讨论了有关Javascript与HTML的所有内容。HTML用于创建网页，它由浏览器解释并以文本和图像的形式显示在屏幕上，而javascript主要用于使网页具有交互性。Javascript是一种比HTML更先进、更复杂的语言，这两种语言一起使用来制作优秀的网站。

者 | Ruqayyah Sara

译者 | 弯月，责编 | 伍杏玲

出品 | CSDN（ID：CSDNnews）

我是一名全栈开发。前几天我一直在研究算法和数据结构，因为对于程序员而言，最重要能力的就是解决问题，所有任何程序员都应该拥有强大的解决问题的基础能力。

两天前我开始学习Python，开始对这门语言有了更多的理解。我开始将其与JavaScript进行比较，因为JavaScript是我日常工作中使用的语言。

JavaScript和Python是两门非常重要的语言。尽管包括我在内的许多人都知道Python或JavaScript，但我们并不清楚两种语言之间的重要区别。

我注意到这两门年语言有许多语义上的区别，相信理解这些区别对我和对其他人都有很大帮助。在本文中，我会比较我在两门语言中遇到的一些基础概念。所以，如果你熟悉JavaScript或Python，想了解二者的差异，那么你就来对地方了！

注释

JavaScript

使用双斜线（//）作为单行注释，/* */ 作为多行注释。

Python

使用 # 作为单行注释，使用三引号""" """ 作为多行注释。

代码块

JavaScript

JavaScript中的每个代码块都必须放在花括号（{}）中，每条语句必须使用分号 ; 结束。

var a = 2;
if(a>0){
console.log("Positive");
}
else{
console.log("Negative");
}

Python

Python中的代码块使用缩进表示。它不使用花括号或圆括号，而是使用空白。每条语句都需要换行。

a = 2
if a>0:
print("Positive")
else:
print("negative")
print("does not belong to else block")

数据类型

我无法在本文中完整地讨论JavaScript和Python之间的数据类型差异，这里我们只讨论主要的差异。

基本数据类型

上面的表格展示了JavaScript和Python的基本数据类型。JavaScript中的Number类型表示Int和float值，由编译器在运行时确定。而JavaScript（ES10）中的BigInt用于存储大整数，而Python使用Int表示所有尺寸的整数。
JS使用关键字表示空值，Python使用None。
Python没有undefined和symbol的概念，这些是JavaScript特有的。
Python有一种特殊的数据类型——complex，用于表示复数 x + yj，其中x是实部，y是虚部。

a=3+4j
print(a.real) #3
print(a.imag) #4

非基本数据类型

上图展示了复杂的（或者叫做非基本）数据类型。Python中的列表能存储任何数据类型，与JavaScript一样。
但是Python中的数组可以使用库（如NumPy，array）来定义。Python中的数组只能包含统一数据类型。Python中的列表和数组有很大区别。数组上可以执行多种数学操作，而列表不能。
JavaScript中的对象类似于Python中的字典。两者都包含键值对。但对象是JavaScript中的基本组成部分，而字典在Python中只不过是个数据容器。
Python中的元组是一个不可修改的列表。用元组表示的列表无法被重新定义。而JavaScript没有这个概念。
因此，Python拥有内置的哈希表（字典），而JavaScript没有内置的哈希表、方法或库。

变量定义

JavaScript

在JavaScript中定义变量需要使用三种主要的关键字：var，let和const。定义方法决定了变量的使用方式（以及作用域）。

Python

Python中定义变量不需要使用关键字，只需要给变量名直接赋值即可：

a = 3
print (a) # 3

If-Else

JavaScript

JavaScript中的条件语句是 if、else if、else还有switch。

Python

Python中的条件语句是if、elif和else。

elif是else-if的缩写。Python没有switch语句。相反，可以用字典来代替。

三元运算符

JavaScript

JavaScript的三元运算符（?:）是一个条件运算符，语法为(condition)?(expresssionIfTrue):(expressionIfFalse)：

var age = 26;
var beverage = (age >= 21) ? "Beer" : "Juice";
console.log(beverage); // "Beer"

Python

Python中的三元运算符的语法是 (expressionIfTrue) if (condition) else (expressionIfFalse)

a, b = 10, 20
min = a if a < b else b
print(min)

全等运算符

JavaScript

全等运算符（===）也叫“严格相等运算符”，会比较两个运算数并检查其相等性，而不会进行类型转换，也就是说，它会检查运算数的数据类型。返回值为布尔。JavaScript只有一个全等运算符。

var a=3,b="3";
console.log(a==b); // true
console.log(a===b); // false

Python

Python有两个全等运算符：is 和 is not。

is 运算符会测试两个运算数是否为同一个对象，is not为is的反面。

x = 5
if (type(x) is int):
print ("true") # true
if ( type(x) is not int):
print ("true")

成员运算符

JavaScript

成员运算符检查对象中的特定属性。JavaScript只有一个成员运算符：in。

const user= {name: 'Sara', age: 19, sex: "female"};
console.log('name' in car);
// output: true

Python

成员运算符用于验证某个值是否为成员。Python有两个成员运算符：in和not in。

x = 24
y = 20
list = [10, 20, 30, 40, 50 ]
if ( x not in list ):
print ("not present") # Output:True

循环

JavaScript

JavaScript有三种循环：

入口控制循环：for和while（在执行循环语句之前测试条件）
出口控制循环：do-while（执行循环语句之后测试条件）

// for loop
var c = ["red", "green", "blue", "purple"];
for (var i = 0; i<4; i++){
console.log(c[i]);
}
// prints array// while
var c = ["red", "green", "blue", "purple"];
while(i<4){
console.log(c[i]);
i++;
} // prints array

Python

Python有两种循环：for和while。Python没有内置的do-while循环。

Python的while循环与JavaScript的for循环类似。例如下面的例子：

c = ["red", "green", "blue", "purple"]
i = 0
while i<4:
print(c[i])
i += 1 # i++ is invalid

Python不支持++和--运算符。我们需要使用x+=1和x-=1。

for循环用来遍历序列（列表、数组和元组）。它使用in操作符和range函数进行迭代。可以用range生成一系列数字，该函数接受三个参数：start，stop和step。

start：开始的位置（可选）。默认为0。
stop：结束的位置（必须指定）。
step：指定序列中两个数字之间的间隔（可选）。

x = range(5)
for n in x:
print(n) # 1,2,3,4x = range(3,9)
for n in x:
print(n) # 3,4,5,6,7,8x = range(2,20,2)
for n in x:
print(n) # 2,4,6,8,10,12,14,16,18

以上就是我注意到的最基本的JavaScript和Python之间的语义区别。

原文链接：https://medium.com/better-programming/semantic-differences-between-javascript-and-python-ed21b1f3ce50

本文为 CSDN 翻译，转载请注明来源出处。

HTML、CSS、JavaScript是前端学习非常重要的内容，作为前端工程师，建立网站，设计网页需要有一定的审美能力，也需要一定的编程技术。总之，技术性越来越强。学习前端这三大块内容，可以先从HTML入手，其次是CSS，在打好这两部分的基础上，进一步学习JavaScript。

WEB可以被看做是一个有生命的物体或人体，HTML可以视为骨骼和肌肉，CSS可以视为皮肤和毛发，而JavaScript可以视为受一定支配的行为。这样比喻不一定完全恰当，但可以帮我们更好的理解这三者之间的关系。本文，千锋武汉HTML5前端培训小编就来详细说说HTML、CSS、JavaScript三者之间的区别！

先从HTML说起：

作为网页内容的载体，HTML包含了用户需要浏览的内容，包括图文、视频，即构成网页的基本元素。HTML是网页的结构（Structure），需要有多种框架和布局，比如frameset框架集、iframe内联框架、div+css布局、table布局等，同时支持表单提交（HTML Form），包括基础表单、input输入框、输入框类型、文本域、列表、label等。当前，大家通用的是HTML5，其中还有一些新增元素，比如footer、header等，总之，HTML的功能越来越强大，作为初学者还是要把握主干，有重点地去学习。

其次是CSS：

CSS的作用是效果，或者说是表现（Presentation），比如网页上的动态文字、文字的色彩、字体、动画效果。正是因为CSS的存在使得HTML变得丰富多样。学习CSS，可以从版本CSS3开始，要了解CSS3的动画效果，如2D变换、过渡、特殊图形的绘制，雪碧图、滑动门等等都是常见的效果；除此之外，CSS3还有媒体查询（Media Queries）、grid，以及多列布局、用户界面等。CSS部分需要配合HTML，并结合实例来加以学习，这样效果会跟好。

最后要说一说JavaScript：

如果说一个网页只有“结构”和“表现”，而缺少了用户与网页的交互，即行为（Behavior），那么这样的网页就如一潭死水，无法形成良好的用户体验。好的用户体验不仅可以让用户鼠标放在哪里、哪里就会产生人性化的效果，而且可以增强用户的可操作性，例如购物网站用户的订购，网页会实时显示用户的购物动态。这样一来，JavaScript就有了编程的意味。和其他编程语言一样，JavaScript也有数据类型、条件语句、分支语句、字符串详解、数组详解、对象、函数、数值、Math函数、作用域。如果这一部分可以学会，便可以往更深的内容去发展。

如今，大前端的时代已经来临，熟练使用HTML5、CSS3，对前端人员的制作要求越来越高，能否做出酷炫的效果成为衡量前端技术的一个标准。作为前端开发工程师，将PC、手机、iPad等多种设备全面掌握并能提供客户需要的解决方案，精通响应式技术，是必备的能力。如今微信小游戏的开发也是前端开发的重点，值得初学者多多关注。

千锋武汉HTML5前端培训小编建议大家重视一下移动端的开发，毕竟移动端的用户数量高于PC端，移动端更适合碎片化的消费人群，市场较为广阔。在未来几十年都将是主流HTML5岗位薪资高，人才缺口超过百万，现在学习正是最佳时机。所以，你还在等什么？快来学HTML5吧！

在线咨询

上一篇：纯CSS丝滑边框线条动画
下一篇：Web前端：HTML的10大重要用途

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

Web前端：JavaScript与HTML—你应该知道的基本区别

注释

JavaScript

Python

代码块

JavaScript

Python

变量定义

JavaScript

Python

Python

三元运算符

JavaScript

Python

JavaScript

Python

JavaScript

Python

JavaScript

Python

您的项目需求