JavaScript 初步认识
首先呢 要成为WEB全栈工程师呢 JavaScript 是必须要会的 高级技术看自身兴趣爱好,但是基础必须掌握 因为有良好的基础学习jQuery会比较轻松。
js是一门轻量的脚本语言 我学它主要目的是针对HTML页面的响应。
1 JS在什么地方写?
JS可以在HTML中的head标签内出现,也可以在body标签中出现,或是在body标签下面写,你也可以把它放在一个后缀为 .js 的文件中。最常见的是在body标签后 和 生成js文件后引入。
1.1 在body后面写js
<!DOCTYPE html>
<html>
<head>
<title>learn javascript</title>
</head>
<body> </body>
{{--js--}}
<script>
alert("yo man what's up");
</script>
</html>
1.2 外部引入
新生成一个js文件 在它的内部写你想写的js代码(这里我们就简单写写):
alert("yo man what's up");
然后在页面中引用:
<!DOCTYPE html>
<html>
<head>
<title>learn javascript</title>
</head>
<body> </body>
{{--js--}}
<script src="demo.js"></script>
</html>
2 输出功能
js常用的输出数据的方法有四种:
- document.write:写入HTML文档中。
- window.alert:弹出一个警告窗口。
- console.log:写入到浏览器控制台中。
- innerHTML:写入到HTML元素中。
2.1 写入HTML文档
<script>
document.write("<h1>hohoho</h1>");
document.write(Date())
</script>
这仅仅是往HTML中写入内容,但是如果在页面已经加载完毕了在执行write的话 页面就会被覆盖。
2.2 警告窗
我们可以通过警告窗向用户展示错误信息或是别的,在开发中也可用于测试。
<script>
window.alert("alert");
alert(1 + 1);
</script>
2.3 写入浏览器控制台
<script>
var number = 5 + 6;
console.log("write to console:" + number)
</script>
这样我们就可以打开浏览器 在开发者工具中的console控制台看见这段话了。很合适调试测试时使用。
2.4 写入HTML元素
这是最常用的方法了,它可以改变HTML中元素的内容。
<!DOCTYPE html>
<html>
<head>
<title>learn javascript</title>
</head>
<body>
<p id="demo" onclick="showDate()">现在几点?</p>
</body>
{{--js--}}
<script>
function showDate(){
// 首先通过ID来查找元素 然后用innerHTML来修改内容。
document.getElementById("demo").innerHTML = Date();
}
</script>
</html>
JavaScript 初步认识的更多相关文章
- python成长之路【第十五篇】:JavaScript初步认识
JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处理. 一.如何编写 1.J ...
- Javascript——初步
1.基本概念 Javascript是一门脚本语言,它是一门解释性的语言.网页和用户之间实时.动态的进行交互. 2.特点 简单性:没有严格的数据类型.语句简单而紧凑. 安全性:仅仅能通过浏览器实现浏览和 ...
- HTML 5 JavaScript初步 编译运行.doc
编译运行 解释运行 JavaScript:只有一种变量类型,var.数据类型:整型,小数,字符串,布尔型 1.如何把数值型字符串变成数字型: parseInt("字符串")——把字 ...
- javascript初步了解
0.1 <script> 和 </script> 会告诉 JavaScript 在何处开始和结束. <script> 和 </script> 之间的 ...
- JavaScript初步
隐式转换 其他类型转换成布尔类型: undefined --> false null --> false 0或者0.0或者NaN --> false 字符串长度为0 --> f ...
- JavaScript初步学习----基本使用,简单事件,修改样式,数据类型
JavaScript基本使用 JavaScript原名叫livescript,是一门动态类型,弱类型基于原型的脚本语言 用于页面特效,前后交替,后台开发(node) JavaScript写在s ...
- JavaScript基于对象编程
js面向对象特征介绍 javascript是一种面向(基于)对象的动态脚本语言,是一种基于对象(Object)和事件驱动(EventDirven)并具有安全性能的脚本语言.它具有面向对象语言所特有的各 ...
- Python基础+Pythonweb+Python扩展+Python选修四大专题 超强麦子学院Python35G视频教程
[保持在百度网盘中的, 可以在观看,嘿嘿 内容有点多,要想下载, 回复后就可以查看下载地址,资源收集不易,请好好珍惜] 下载地址:http://www.fu83.cc/ 感觉文章好,可以小手一抖 -- ...
- div模拟selection标签 下拉列表
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- centos7 iptables和firewalld学习记录
centos7系统使用firewalld服务替代了iptables服务,但是依然可以使用iptables来管理内核的netfilter 但其实iptables服务和firewalld服务都不是真正的防 ...
- Laravel 5系列教程五:MVC的基本流程
免费视频教程地址https://laravist.com/series/laravel-5-basic 期间受到很多私事影响,终于还是要好好写写laravel的教程了. 上一篇我们说了数据库和Eloq ...
- 深入NIO Socket实现机制(转)
http://www.jianshu.com/p/0d497fe5484a# 前言 Java NIO 由以下几个核心部分组成: Buffer Channel Selector 以前基于net包进行so ...
- vue手机端横屏竖屏切换
1.建一个空白的vue文件,添加上如下代码 data() { this.$router.go(-1) return {} } 2.在需要横屏竖屏切换的页面中加入如下代码: beforeMount( ...
- Subl 命令
Subl 是sublime 的命令 添加环境变量后可以,在cmd 或者git 下直接 使用subl 进行 打开sublime Example: Subl 打开编辑器 Subl . 将当 ...
- js apply和call区别
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- jquery淡入淡出无延迟代码
<!DOCTYPE html> <html> <head> <script src="jquery.js"></script& ...
- iOS 两种不同的图片无限轮播
代码地址如下:http://www.demodashi.com/demo/11608.html 前记 其实想写这个关于无限轮播的记录已经很久很久了,只是没什么时间,这只是一个借口,正如:时间就像海绵, ...
- 了解机器学习框架CoreML
代码地址如下:http://www.demodashi.com/demo/11972.html CoreML是iOS 11新推出的机器学习框架,是人工智能的核心内容,他可以在训练好的机器学习模型应用到 ...
- ScrollView嵌套ListView冲突问题的最优解决方式
项目做多了之后.会发现事实上ScrollView嵌套ListVew或者GridView等非经常常使用,可是你也会发现各种奇怪问题产生.依据个人经验如今列出常见问题以及代码最少最简单的解决方法. 问题一 ...