从零开始学_JavaScript_系列(一)初步概念、工具选择、简单内容输出、加载js文件

简介:

1)适用:

HTMLweb,可广泛用于服务器,PC,笔记本电脑,平板电脑和手机。

是所有现代浏览器和HTML5的默认脚本语言。

实际写的时候是跟HTML写一起,或者通过HTML来调用的。

 

 

2)本质:

脚本语言。

①轻量级编程语言;

②可插入HTML页面的编程代码;

③插入HTML页面后,可由所有的现代浏览器执行;

④易学。

 

 

 

3<script></script>标签

HTML的脚本必须位于<script></script>之中。

在这里,就是指JavaScript脚本必须位于<script></script>之中。

即:

<script>

JS脚本

</script>

 

 

 

4JavaScript的作用

①写入HTML用于输出(例如输出一行文字);

②对事件作出反应(例如点击按钮后有变化);

③其他(略)。

 

 

 

5)如何使用

创建一个文本文档,然后后缀改为html,用记事本打开,然后就可以往里面写东西了。

写出来的是网页(html),以网页形式展现输出结果。

也可以使用微软的FrontPage2003软件,特点是代码加亮、所写即所见等,但缺点貌似是加载其他js文件时无法显示加载的内容。

也可以使用VS(我的VS2015可以),会代码加亮、自动缩进等,不过经常会有警告性报错,而且查看效果的话需要通过浏览器。

或者使用其他html编辑工具。

 

 

6)标签

成对出现的<>(共2组)就是标签。

<p>文本</p>就是一组标签。

标签可以加id,如<p id="abc">文本</p>id用于之后寻找其使用。

寻找id使用getElementById("abc")这样的办法。

然后在这样的命令后面加对应的东西,如innerHTML(文本替换),value(得到值)。

<p id="abc">abc</p>

<button type="button" onclick="run()">点击</button>

<script>

function run()
{
document.getElementById("abc").innerHTML="ppp";

}

</script>

像这样的代码,在执行时,用ppp文本替换abc文本。

7)具体解释:

第一行是输出文字abc,然后给他一个id(用来找她)。

第二行是输出一个按钮(button),按钮上面的文字是点击。

第三行到最后</script>js脚本。这个脚本里面包含了一个函数(function);

函数的效果是,在标签idabc的地方(通过getElementById获得),用文本ppp替换之。

 

8)输出时间:

<p id="time"></p>

<script>

var nowtime=new Date(); //获得时间

localtime=nowtime.toString(); //将时间转为字符串

document.getElementById("time").innerHTML=localtime; //idtime的地方输出时间,注意,time需要在这行之前才可以

</script>

 

输出效果:

Sun Mar 27 2016 00:26:32 GMT+0800 (中国标准时间)

 

9)关于时间的其他函数:

hour=nowtime.getHours(); //将小时赋给hour

min=nowtime.getMinutes(); //分钟

second=nowtime.getSeconds(); //

day=nowtime.getDate(); //

mon=nowtime.getMonth(); //

year=nowtime.getFullYear(); //

datashow=year+""+mon+""+day+""+hour+""+min+""+second+"";

document.getElementById("time").innerHTML=datashow; //idtime的地方输出时间,注意,time需要在这行之前才可以

 

输出效果:

201622703827

 

 

10)导入一个js文件

使用

<script src="time.js"> //读取time.js这个JavaScript文件内容

</script>

然后可以将之前的关于timejs命令,放入time.js文件内(无需加上<script>标签)即可。

目录
相关文章
|
11月前
|
Web App开发 数据采集 JavaScript
动态网页爬取:Python如何获取JS加载的数据?
动态网页爬取:Python如何获取JS加载的数据?
1604 58
|
8月前
|
编解码 JavaScript 前端开发
如何在网页播放英文的m3u8文件(基于Javascript搭建的在线网页工具)
什么是m3u8?又该如何在网页中高效、便捷地播放英文的m3u8文件呢?今天这篇文章就带你一起了解,并推荐一种基于Javascript搭建的在线网页工具,让你轻松解决播放问题。
2453 0
|
10月前
|
存储 前端开发 JavaScript
仿真银行app下载安装, 银行卡虚拟余额制作app,用html+css+js实现逼真娱乐工具
这是一个简单的银行账户模拟器项目,用于学习前端开发基础。用户可进行存款、取款操作,所有数据存储于浏览器内存中
|
11月前
|
资源调度 JavaScript 前端开发
Day.js极简轻易快速2kB的JavaScript库-替代Moment.js
dayjs是一个极简快速2kB的JavaScript库,可以为浏览器处理解析、验证、操作和显示日期和时间,它的设计目标是提供一个简单、快速且功能强大的日期处理工具,同时保持极小的体积(仅 2KB 左右)。
682 24
|
11月前
|
人工智能 监控 前端开发
基于 Next.js 的书法字体生成工具架构设计与 SSR 优化实践
本项目是一款书法字体生成工具,采用 Next.js 14(App Router)与 Tailwind CSS 构建前端,阿里云 Serverless 部署后端。通过混合渲染策略(SSG/SSR/CSR)、Web Worker 异步计算及 CDN 字体分片加载优化性能。服务端借助阿里云函数计算处理计算密集型任务,将平均耗时从 1200ms 降至 280ms,支持 1000+ QPS。动态路由与 ARMS 监控提升工程化水平,未来计划引入 WebGPU 和 AI 字体风格迁移技术,进一步优化用户体验。
|
JavaScript 前端开发 算法
JavaScript 中通过Array.sort() 实现多字段排序、排序稳定性、随机排序洗牌算法、优化排序性能,JS中排序算法的使用详解(附实际应用代码)
Array.sort() 是一个功能强大的方法,通过自定义的比较函数,可以处理各种复杂的排序逻辑。无论是简单的数字排序,还是多字段、嵌套对象、分组排序等高级应用,Array.sort() 都能胜任。同时,通过性能优化技巧(如映射排序)和结合其他数组方法(如 reduce),Array.sort() 可以用来实现高效的数据处理逻辑。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
JSON JavaScript 数据格式
从零开始学_JavaScript_系列(22)——dojo(9)(表单、JsonRest的post方法,widget的使用思路)
(74)dojo的表单模块 插件:dojo/dom-form 参数:domForm 解释:        当我们需要像服务器提交很多内容时(比如很多个input输入框,还有一些单选按钮、多选按钮),我们必须将这些输入框的值变成一个对象(也许还要转为一个json字符串),在post的时候将其传递给服务器;          假如一个一个读过去,这也太傻了。所以这就是dom-for
1689 0
|
JavaScript 前端开发 Python
从零开始学_JavaScript_系列(21)——dojo(8)(手把手教你封装一个widget)
(73)封装一个widget 醒目:必须在web环境下使用,无论是python的web.py或者是通过http访问网站环境,都可以,但纯本地是不可行的。   首先,什么是widget? 简单来说,就是一个dom结点,比如像这样: &lt;div&gt;     这是一个dom结点 &lt;/div&gt;   为什么需要widget呢? 很简单,比如,我们想在这样一个地方:
2175 0