静态Web开发 JavaScript
三章 Javascript
1节
javascript基本语法和注意事项
脚本,一条条的文字命令。执行时由系统的一个解释器,将其一条条的翻译成机器可识别的指令,然后执行。(不需要编译)
常见的脚本:批处理脚本、T-SQL脚本、VBScript等。(.net生成的exe文件用记事本打开看不懂)
js有一种计算能力的作用,可以在页面添加一些功能
LiveScript+java一些特性--->js
工具:Editplus MyEclipse Visual Studio 2010
var声明变量
<script type="text/javascript">
var n=10;n="我是js";
</script>
js基本组成:
ECMAScript基本语法(浏览器都支持,有统一标准)
Dom(文档对象模型)
Bom(浏览器对象,一般功能浏览器支持,没有统一标准)控制浏览器可见区域以外的部分
注意:
大小写铭感
弱类型语言,声明用var
字符串用单引号(建议)
每句话后面加';'
js注释与c# java一样
alert("我的名字是:"+name);
alert(new Date().toLocaleTimeString());
2节
外部引用js文件
<script language= > //不推荐,依然在使用
<script>标签也可以放到html里或body,先执行head中的js
js标签可以有多个
alert('今天是个耗子日,</script>'); //当前js就结束了; 要想显示,用纯字符型拼接:</'+'script>'>
<script src="1.js" type="text/javascript"> //1.js 值写js内容,需要js标签
</script>
3节
js中的事件超链接显示时间
<input type="button" οnclick="alert(new Date().toLocaleString());" />
<a href="#" οnclick="...">百度</a> //‘#’ 默认跳转起始位置
<a href="javacript:void(0);" οnclick="..."></a> //void(0) 表示没有用的值,不去任何地方
<a href="javascript:alert('时间');"></a>
4节
数据类型
变量命名规则:字母、下划线、$开头,中间可以有数字
声明字符串时用单引号,主要是方便和html进行合成,避免转义符的麻烦
声明变量时,如果前面没有var,那么此时该变量为全局变量,可以会和将来外部引入的js局部变量冲突
数据类型:Boolean Number(数字) String Undefined(未定义) Null(空对象) Object(对象类型), underfined与其他计算结果不是我们想要的
//判断变量是哪种数据类型?
var n1=10;
alert(typeof n1); //Number
var n2=null;
alert(typeof n2);alert(String(n2)); //Object //Null
var n3;
alert(typeof n3); //Undefined
alert(typeof(n3));
//判断数据对象是不是某种数据类型 instanceof
var obj=new Object();
alert(obj instanceof Object);
//null(已知的)和undefined(未知的)
alert(Boolean(underfined)); //false
alert(Boolean(null)); //false
alert(underfined==null); //true 非严格判断
alert(underfined===null); //false 严格判断(类型相同,值相等)
//判断一个变量是否可以使用,判断不是null underfined
var n; //n=null
if(typeof(n)!='underfined' && n!=null){
alert("该变量可以使用");
}else {
alert("该变量不可以使用");
}
5节
变量的作用域和js转义
<script type="text/javascript">
var n=10;
function fun(){
var num=100;
for(var i=0;i<10;i++){ //可以吧i直接申明在最外面
...
}
alert(i);
}
fun(); //js中没有作用域这个问题
</script>
<script type="text/javascript">
n=null;//释放掉这个n
alert(n); //能打印n,n为全局变量
</script>
//js转义
alert('c:\\sss\\ffff\\aaa.txt');
6节
类型转换
<script type="text/javascript">
//1 转整数
var n='100'; //n='100fs' n='nn100'
ver n1=parseInt(n); //parseInt(n,8) -->8进制的n进行转换
alert(n1+100);
//2 转小树
var num=parseFloat('100.7');
//3 转数字
var num='100'; //num='100fs'
var n=Number(num);
alert(n+100);
//4 判断是不是整数
var n=100;
if(isNaN(n)){
alert('不能使用');
}else{
alert('可以使用');
}
</script>
//5
String(arg) 表示任意类型可以转字符串
Boolean(arg) 表示任意类型的值可以转Boolean
7节
js中的方法
//1
function show1(){
alert(...);
}
show1();
//2
function showName(name){
alert('我的名字:'+name);
}
showName('小子')
//3 呆参数呆返回值
function addNum(num){
return 100+num;
}
var sum=addNum(100);
alert(sum);
//自定义的函数名不要和js内置、dom内置的方法重名,比如selectAll、focus等函数名不要用
js中没有方法的重载 arguments对象:可以获得方法有多少个参数和传的方法的值
function addNumber(){
//alert(arguments.length);
var ret=0;
for(var i=0;i<arguments.length;i++){
ret += arguments[i];
}
return ret;
}
//一个方法没有明确的返回值,得到的结果就是undefined
var sum=addNumber(1,2,3,4,5);
alert(sum);
8节
js中的匿名方法
//1
var ff=function(){
alert('帅');
}
ff();
//2
οnlοad=function(){
document.getElementById('btn').οnclick=function(){
alert('学好电脑');
}
}
<input type="button" id="btn" />
//3
(function(n1,n2){alert(n1+n2);})(1,2);
9节
字符串常用方法
length charAt() indexOf() split() substr()/substring() toUpperCase()/toLowerCase()
var msg="我好开心!创奇拿明月湖"
alert(msg.length);
alert(msg.charAt(2));
//2
var i = msg.indexOf('光',0);
alert(i);
//3
var names='东邪|西毒|南帝|北丐';
var strs=names.split('|');
//alert(strs);
for(var i=0;i<strs.length;i++){
alert(strs[i]);
}
//4
var msg='我靠,美死了';
//var s = msg.substr(1,3); //截取子字符串(从索引1到索引3)
var s=msg.substring(1,3) (从索引1到索引2)
alert(s);
//5
toUpperCase(); toLowerCase();
10节
js中的数组
js中的Array对象就是一个数组,是一个动态数组:可以存数字、Boolean等等类型,可以看成是一个像C#中的数组、ArrayList、Hashtable等的超强综合体
var aa=new Array();
aa[0]=1;
aa[1]=false;
aa[2]='zhangsan';
//2
var arr=[1,2,false,'zs']; //数组
for(){
alert(arr[i]);
}
for(var key in arr){ //key 索引
alert(key+'=='+arr[key]);
}
//3
var arr={"东邪":"123","西毒":"345"}; //键值对
for(var key in arr){ //key 键值对中
alert(key+'=='+arr[key]);
}
11节
js中的扩展方法及调试
通过类对象的prototype设置扩展方法
//1
var msg="qwweer@126.com";
String.prototype.isEmail=function(){
return this.indexOf('@')!=-1?true:false;
};
alert(msg.isEmail());
//2 调试--->google--->设置断点---F11单步运行----Console中的调出所有方法
var sum=0;
for(var i=0;i<10;i++){
sum+=i;
}
alert(sum);
//2 调试--->google--->设置断点---F11单步运行----Console中的调出所有方法
【详情-->请查看:】
1 <script type="text/javascript"> 2 //最简单的方法是console.log(),可以用来取代alert()或document.write()。 3 console.log("Hello World"); 4 //console对象还有4种显示信息的方法,分别是一般信息console.info()、除错信息console.debug()、警告提示console.warn()、错误提示console.error()。 5 console.info("这是info"); 6 console.debug("这是debug"); 7 console.warn("这是warn"); 8 console.error("这是error"); 9 //3 占位符 10 //console对象的上面5种方法,都可以使用printf风格的占位符。不过,占位符的种类比较少,只支持字符(%s)、整数(%d或%i)、浮点数(%f)和对象(%o)四种。 11 console.log("%d年%d月%d日", 2011, 3, 26); 12 console.log("圆周率是%f", 3.1415926); 13 var dog = {}; 14 dog.name = "大毛"; 15 dog.color = "黄色"; 16 console.log("%o", dog); 17 //4 分组显示 18 //如果信息太多,可以分组显示,用到的方法是console.group()和console.groupEnd()。 19 console.group("第一组信息"); 20 console.log("第一组第一条"); 21 console.log("第一组第二条"); 22 console.groupEnd(); 23 console.group("第二组信息"); 24 console.log("第二组第一条"); 25 console.log("第二组第二条"); 26 console.groupEnd(); 27 //5 console.dir() 28 //console.dir()可以显示一个对象所有的属性和方法。比如,现在为第二节的dog对象,添加一个bark()方法。 29 dog.bark = function () { alert("汪汪汪"); }; 30 console.dir(dog); 31 </script>
JS中Console的方法
转载于:https://www.cnblogs.com/adolphyang/p/4686142.html
静态Web开发 JavaScript相关推荐
- 静态Web开发 JQuery
静态Web开发 JQuery 伍章 JQuery 1节 介绍JQuery和顶级对象 <<锋利的JQuery>> JQuery官网: http://jquery.com (下载j ...
- 视频教程-移动端Web开发-JavaScript
移动端Web开发 TriAquae开源运维软件创始人,混迹IT运维领域多年,曾就职于松下.国政通.飞信.中金.NOKIA等公司,维护过少至几十台,多至数万台设备的IT系统,致力于提高企业运维自动化水平 ...
- WEB开发 JavaScript
WEB开发 JavaScript 1,JavaScript简介 web前端有三层: HTML:从语义的角度,描述页面的结构 CSS:从审美的角度,描述样式(美化页面) JavaScript:从交互的角 ...
- python web开发 JavaScript基础
文章目录 1. script 标签 2. 字面量.变量 3. 数据类型 4. 运算符 5. if 条件 6. switch分支 7. for循环 8. while循环 9. break, contin ...
- 如鹏网 静态Web开发 第三章:Javascript
本章主干知识点: 1.定义js的三种方式:写到html标签中:写到html的script标签中:写到单独的js文件中: 2.JavaScript中类型的转换 3.function.匿名function ...
- 2020年 Web 开发的最佳编程语言
现在最需要的技能之一是编写编程代码的专业知识.以计算机为基础的智能,ML和区块链看起来是本世纪压倒一切的潜在竞争者.Web计划和改进是最重要的吸引人的领域,也是许多新的爆破模式的建立. 最热门的开发语 ...
- 了不起的Node.js: 将JavaScript进行到底(Web开发首选,实时,跨多服务器,高并发)...
了不起的Node.js: 将JavaScript进行到底(Web开发首选,实时,跨多服务器,高并发) Guillermo Rauch 编 赵静 译 ISBN 978-7-121-21769-2 2 ...
- Spring Boot与Web开发简介||SpringBoot对静态资源的映射规则
Web开发 1.简介 使用SpringBoot: 1).创建SpringBoot应用,选中我们需要的模块: 2).SpringBoot已经默认将这些场景配置好了,只需要在配置文件中指定少量配置就可以运 ...
- Web开发:HTML5、CSS、JavaScript必备教程
2019独角兽企业重金招聘Python工程师标准>>> Web开发:HTML5.CSS.JavaScript必备教程 想开启Web开发的智慧之门吗?想DIY炫酷的网页特效设计吗?想通 ...
最新文章
- 字符串插入_计算机毕业设计中小程序插入html代码
- 【转】Linux 前后台作业切换及脱机管理
- OpenCV cv :: UMat与DirectX10曲面的互操作性的实例(附完整代码)
- java velocity详解_[velocity] velocity详解
- Mockito 的使用
- 一台电脑同时启动多个java_如何在一台同时登录多个微信?
- Latex 加空格的方法
- [ECharts]echarts/config is not exists
- python难度大吗_python需要学多久?自学两年也很难达到企业标准
- [Android] android:visibility属性应用
- 关于字符编码的一点学习。
- android 定时唤醒蓝牙,Android保活——蓝牙唤醒(主动kill掉也可唤醒)
- 从图书馆进入网络刷题练习与考试平台
- DbgView不能显示OutputDebugString的输出内容
- 手机内存卡大小的计算
- FinalShell Mac OS版安装
- 服务器centos系统诛仙,云服务器搭建诛仙教程
- [附源码]Nodejs计算机毕业设计基于java学科竞赛管理系统Express(程序+LW)
- html手机自动放大,解决HTML5手机端页面缩放的问题
- ISDB-T DVB-T DTV ATV
热门文章
- 你觉得人生最好的年龄段是哪段时间?
- 冬天你的车热的正确吗?如何正确热车?
- 5个层次的赚钱模式,看看你是哪一种?
- 创业一定要做自己“喜欢”并且有“优势”的事情
- 家里电脑是win10,但开机都要3分钟,请问怎么提快电脑速度?
- 华为和谷歌在全球开发者眼里二选一,谁会获得胜利?
- sql 线性回归_SQL Server中的Microsoft线性回归
- 在SQL Server中使用SQL Coalesce函数
- cte公用表表达式_SQL Server中的CTE; 查询公用表表达式
- azure 导入 bak_使用Azure Data StudioSQL Server数据导入