web前端基础——初识JavaScript
1 JavaScript概述
JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
(1)存在形式
第1种:JavaScript语句直接嵌入HTML中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--定义函数和调用函数-->
<script type="text/javascript">
function func(){
alert('警告!')
}
// 调用函数
func()
</script> </body>
</html>
第2种:JavaScript语句单独以文件形式存在,然后在HTML文件中导入
//js文件
1 function func()
{
alert('提示'); //弹框
}
<!--HTML文件-->
1 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--导入js文件-->
<script type="text/javascript" src="js.js"></script>
<script>
// 执行js文件中的函数
func()
</script> </body>
</html>
注意:JavaScript语句以分号结束,单行注释为“//”,多行注释为“/**/”。
(2)JavaScript代码在HTML文件中的位置
<body></body>标签内的代码底部
2 JavaScript基本语法
2.1 变量
//(1)全局变量
name='jerry';
//(2)局部变量
var name='jerry';
2.2 函数
//基本函数定义
function foo(arg){
console.log(arg);
}
//函数调用
foo("基本函数") //匿名函数
var f2 = function(arg){
alert(arg);
}
//函数调用
f2("匿名函数"); //自执行函数,注意括号
(function (arg) {
alert(arg);
})("自执行函数")
2.3 字符串常用方法和属性
obj.trim() //去除字符串两边空格
obj.trimLeft() //去除字符串左边空格
obj.trimRight() //去除字符串右边空格 obj.indexOf(c) //查找字符的索引
obj.charAt(index) //查找索引对应的字符 obj.substring(start,end) //字符串切片 obj.length //字符串的长度,注意没有括号,对象的属性
2.4 数组基本操作
//数组声明,如:
var array = Array() 或 var array = []
//添加元素
obj.push(ele) //追加
obj.unshift(ele) //最前插入
obj.splice(index,0,'content') //指定索引插入,第2个参数必须为0
//移除元素
obj.pop() //数组尾部获取
obj.shift() //数组头部获取
obj.splice(index,count) //数组指定位置后count个字符
//数组切片
obj.slice(start,end)
//数组合并
newArray=obj1.concat(obj2)
//数组翻转
obj.reverse()
//数组转换为字符串
obj.join('连接符') //python中为'连接符'.join(obj)
//数组长度
obj.length
//字典(特殊数组)
obj={'key':'value'} //注意与Python的区别,这里的引号可加可不加
obj.key //字典取值
Object {k1:"v1"} //Object类型的字典
2.5 循环
//JavaScript中字符串、数组(包括字典)都是集合,查看集合的内容,通过循环
var a = '123456789';
//第1种循环方式
for(var i=0;i<10;i++){
console.log(a[i]);
}
//第2种循环方式
for(var item in a){
console.log(a[item]);
}
2.6 异常处理
//try...catch...finally为异常捕获,其中e为异常原因
try{
var m = n;
}catch(e){
console.log(e);
}finally{
console.log("finally");
}
参考资料:
http://www.cnblogs.com/wupeiqi/articles/4457274.html
web前端基础——初识JavaScript的更多相关文章
- 进击的Python【第十四章】:Web前端基础之Javascript
进击的Python[第十四章]:Web前端基础之Javascript 一.javascript是什么 JavaScript 是一种轻量级的编程语言. JavaScript 是可插入 HTML 页面的编 ...
- Web前端基础(7):JavaScript(一)
1. JavaScript概述 1.1 JavaScript历史背景介绍 布兰登 • 艾奇(Brendan Eich,1961年-),1995年在网景公司,发明的JavaScript. 一开始Java ...
- web前端基础——初识HTML
1 HTML概念 HTML(Hypertext Markup Language)即超文本标记语言,是网页的描述语言.它其实是一种描述网页的标准,它通过给需要描述的内容加上标签,浏览器按照HTML语言的 ...
- Web前端基础(13):JavaScript(七)
1. BOM JavaScript基础分为三部分: ECMAScript:JavaScript的语法标准.包括变量.表达式.运算符.函数.if语句.for语句等. DOM:文档对象模型,操作网页上的元 ...
- Web前端基础(11):JavaScript(五)
1. 初识DOM 1.1 DOM介绍 1.1.3 什么是DOM DOM:文档对象模型.DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构.目的其实就是为了能让js操作html元素而制定 ...
- Web前端基础(10):JavaScript(四)
1. 伪数组arguments arguments代表的是实参.有个讲究的地方是:arguments只在函数中使用. 1.1 返回参数个数 返回函数实参的个数:arguments.length 例子: ...
- Web前端基础(8):JavaScript(二)
1. 数据类型转换 1.1 将数值类型转换成字符串类型 1.1.1 隐式转换 在js中,当运算符在运算时,如果两边数据不统一,CPU就无法计算,这时我们编译器会自动将运算符两边的数据做一个数据类型转换 ...
- web前端基础——初识HTML DOM编程
1 HTML DOM编程概述 文件对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理HTML的标准编程接口.由于HTML文档被浏览器解析后就是一棵DOM树,要改 ...
- Web前端基础(12):JavaScript(六)
1. JS中的面向对象 创建对象的几种常用方法: 1.使用Object或对象字面量创建对象 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对象 1.1 使用Object或对象字面量创 ...
随机推荐
- LINQ to SQL语句(2)Count/Sum/Min/Max/Avg操作符
使用场景 类似于SQL中的聚合函数,用于统计数据,不延迟.如返回序列中的元素数量.求和.最小值.最大值.求平均值. Count 说明:用于返回集合中元素的个数,返回Int类型,生成SQL语句为SELE ...
- Hibernate_day01--解决配置文件没有提示问题_演示常见错误
解决配置文件没有提示问题 1 可以上网 2 把约束文件引入到eclipse中 (1)在配置文件中复制一句话 重启eclipse开发工具 演示常见错误 1 在映射配置文件中,把name属性值写错了,和实 ...
- 《SQL Server 2000设计与T-SQL编程》
<SQL Server 2000设计与T-SQL编程> <SQL Server 2000设计与T-SQL编程>笔记1 http://dukedingding.blog.sohu ...
- Redesign Your App for iOS 7 之 页面布局
Redesign Your App for iOS 7 之 页面布局 http://www.vinqon.com/codeblog/?detail/11109
- c#基础 第五讲
using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threa ...
- 【BZOJ1050】[HAOI2006]旅行comf 并查集
[BZOJ1050][HAOI2006]旅行comf Description 给你一个无向图,N(N<=500)个顶点, M(M<=5000)条边,每条边有一个权值Vi(Vi<300 ...
- 《从零开始学Swift》学习笔记(Day67)——Cocoa Touch设计模式及应用之MVC模式
原创文章,欢迎转载.转载请注明:关东升的博客 MVC(Model-View-Controller,模型-视图-控制器)模式是相当古老的设计模式之一,它最早出现在Smalltalk语言中.现在,很多计算 ...
- python AI(numpy,matplotlib)
http://blog.csdn.net/ywjun0919/article/details/8692018 apt-cache policy python-numpy sudo apt-get in ...
- Storm-源码分析-LocalState (backtype.storm.utils)
LocalState A simple, durable, atomic K/V database. *Very inefficient*, should only be used for occas ...
- 设计模式之Singleton模式
当程序运行时,有时会希望在程序中,只能存在一个实例,为了达到目的,所以设计了Singleton模式,即单例模式. 单例模式的特征: 想确保任何情况下只存在一个实例 想在程序上表现出只存在一个实例 示例 ...