HTML、CSS、JS在前端开发中都扮演怎样的角色
前端开发,需要经常接触 HTML、DOM、CSS、JS等,那么HTML、CSS、JS在前端开发中究竟扮演怎样的角色呢?以下是个人的一些观点...
HTML:超文本标记语言 (Hyper Text Markup Language),不是一种编程语言,而是一种标记语言。
定义了文档的内容,决定了要显示网页中的各个组成部分。(HTML文档中的每个成分都是一个节点——dom节点)
相当于“名词”。
CSS:层叠样式表 (Cascading Style Sheets),定义了如何显示HTML元素。(宽度、高度、颜色、位置、边框、阴影等)
相当于“形容词”。(用来修饰dom节点)
JS:客户端的一种脚本语言,是一种轻量级的编程语言,具有简单的面向对象的特征。
操作的是dom实现的“动态效果”,即实现页面动画效果。常用来给HTML网页添加动态功能,比如响应用户的各种操作。
js是在html和css完成后添加的效果,例如轮播图、点击弹框、鼠标移动或悬浮不同位置呈现不同的效果等,还支持异步请求,即在不刷新页面的情况下从后台(服务端)请求数据。
相当于“动词”。
结构----HTML(标签、节点)
样式----CSS(颜色,位置)
逻辑----JavaScript(控制)
注意:1、css3出来后,可通过伪元素实现部分动画。
2、以上关于名词、形容词、动词的说法只是为了方便理解,不具备普遍定义性。
(该文仅供学习交流。如有不同观点,欢迎留下宝贵意见~)
HTML、CSS、JS在前端开发中都扮演怎样的角色的更多相关文章
- 前端进阶试题css(来自js高级前端开发---豪情)既然被发现了HOHO,那我就置顶了嘿嘿!觉得自己技术OK的可以把这套题目做完哦,然后加入高级前端的社区咯
http://www.cnblogs.com/jikey/p/4426105.html js高级前端开发加群方法(此群很难进,里面纯技术,严禁广告,水群) 完整题目做完发邮箱(jikeytang@16 ...
- JS高级前端开发群加群说明及如何晋级
JS高级前端开发群加群说明 一.文章背景: 二. 高级群: 三. 加入方式: 四. 说明: 一.文章背景: 去年年初建了几个群,在不经意间火了,一直排在“前端开发”关键字搜索结果第一名.当然取得这 ...
- JS高级前端开发群加群说明
JS高级前端开发群加群说明 *一.文章背景: *二. 高级群: *三. 加入方式: *四. 说明: 一.文章背景: 去年年初建了几个群,在不经意间火了,一直排在"前端开发"关键字搜 ...
- (webstorm的CSS插件)前端开发必备!Emmet使用手册
介绍 Emmet (前身为 Zen Coding) 是一个能大幅度提高前端开发效率的一个工具: 基本上,大多数的文本编辑器都会允许你存储和重用一些代码块,我们称之为“片段”.虽然片段能很好地推动你得生 ...
- Vue.js高效前端开发知识 • 【目录】
持续更新中- 章节 内容 实践练习 Vue.js高效前端开发 • (实践练习) 第1章 Vue.js高效前端开发 • [ 一.初识Vue.js ] 第2章 Vue.js高效前端开发 • [ 二.Vue ...
- Vue.js高效前端开发 • 【Vue基本指令】
全部章节 >>>> 文章目录 一.Vue模板语法 1.插值 2.表达式 3.指令概述 4.实践练习 二.Vue绑定类样式和内联样式 1.Vue绑定类样式 2.Vue绑定内联样式 ...
- 使用 mock.js 让前端开发与后端独立
直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...
- Vue.js高效前端开发 • 【Ant Design of Vue框架基础】
全部章节 >>>> 文章目录 一.Ant Design of Vue框架 1.Ant Design介绍 2.Ant Design of Vue安装 3.Ant Design o ...
- Vue.js高效前端开发 • 【初识Vue.js】
全部章节 >>>> 文章目录 一.Vue概述 1.Web前端框架介绍 2.MVC和MVVM 3.Vue介绍 4.安装Vue 二.Vue使用 1.第一个Vue应用 2.Vue的双 ...
随机推荐
- 使用requestAnimationFrame做动画效果一
最近学习了requestAnimationFrame,看了张鑫旭直白易懂,但是某些地方语言过于裸露的文章http://www.zhangxinxu.com/wordpress/2013/09/css3 ...
- Discuz! X论坛上传附件到100%自动取消上传的原因及解决方案
最近接到一些站长的反馈,说论坛上传附件,到100%的时候自己取消上传了.经查是附件索引表pre_forum_attachment表的aid字段自增值出现了问题,导致程序逻辑返回的aid值实际为一个My ...
- SharePoint 2013 List 备份使用
在测试环境新建List后经过不懈的调整,验证终于做出一个像模像样的表单. 这时候问题来... 要怎么迁移到生产环境或者正式环境呢? 在网上找了一些资料,不过都是10的.. 其实想想13跟10区别不大, ...
- kaggle数据挖掘竞赛初步--Titanic<数据变换>
完整代码: https://github.com/cindycindyhi/kaggle-Titanic 特征工程系列: Titanic系列之原始数据分析和数据处理 Titanic系列之数据变换 Ti ...
- 一个会Flash的人来说CSS3
以前在上大学的时候学过Flash,而且以前做一些网页效果都是用的Flash,现在才知道以前我所用的方法是有多麻烦.在学过CSS3之后,我发现以前要用Flash写半天的效果,现在用几句CSS3代码就搞定 ...
- PSP记录个人项目耗时情况
四则运算编程 PSP记录个人项目耗时情况 PSP Personal Software Process Stages Time(%) Planning 计划 7 Estimate 估计这个任务需要多少时 ...
- classLIST元素增删改查方法
window.onload=function () { var oDiv=document.getElementsByTagName('div')[0]; var oInP=document.getE ...
- POJ 2528 Mayor's posters
Mayor's posters Time Limit:1000MS Memory Limit:65536KB 64bit IO Format:%I64d & %I64u Sub ...
- 安装AutoCAD2006时,提示已终止安装
.NET Framework Runtime 1.1 版本比你机子里面的版本低,直接跳过这个安装就可以了.直接运行acad.msi,直接安装.
- linux 安装mysql两种方式
yum -y install gcc gcc-c++ ncurses-devel cmake bison zlib zlib-devel libxml openssl dtrace ...