JavaScript入门基础

发布时间：2020-07-13 13:03:05 来源：网络阅读：246 作者：专注地一哥栏目：web开发

一、JavaScript简介
JavaScript是一种属于网络的解释性脚本语言，已经被广泛用于Web应用开发，常用来为网页添加各式各样的动态功能，为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。
主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。
可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的分离。
跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行。
Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。
二、为什么要学JavaScript？
所有主流浏览器都支持JavaScript
目前，ThinkMarkets代理申请www.kaifx.cn/broker/thinkmarkets.html,全世界大部分网页都使用JavaScript
它可以让网页呈现各种动态效果
三、开始正式学习JavaScript

<script>标签
<script>
JS代码在这里
html代码不能写在这里！
</script>
<script>标签可被放置在 HTML 页面的 <body> 和 <head> 部分中。
<script> 和 </script> 会告诉 JavaScript 在何处开始和结束。
document.getElementById( )
document.getElementById("id").style.color="color";
<Button type="Button" onclick="alert('Hello World!')">点我这个Button！</Button>
document.getElementById("h2").innerHTML="innerHTML可以替换HTML元素";
控制台输出
控制台输出: console.log()
清除控制台信息: console.clear()
注释
HTML注释 
JavaScript注释 // /.../
数据类型
在 JavaScript 中有 5 种不同的数据类型:
string number boolean object function
3种对象类型:
Object Date Array
2个不包含任何值的数据类型:
null undefined
如果对象是 JavaScript Array 或 JavaScript Date,我们就无法通过typeof来判断他们的类
型,因为都是返回Object。
变量申明
var a = 666;
var b = "666 abc";
1
2
数组
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
};
函数
function(){
...
}
内嵌函数
JavaScript 支持嵌套函数,嵌套函数可以访问上一层的函数变量。
该实例中,内嵌函数 plus() 可以访问父函数的 counter 变量。
实例:
function add() {
var counter = 0;
function plus() {counter += 1;}
plus();
return counter;
}
正则表达式
正则表达式（在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹
配一系列符合某个句法规则的字符串搜索模式。
正则表达式是由一个字符序列形成的搜索模式。
当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。
正则表达式可用于所有文本搜索和文本替换的操作。
语法
/正则表达式主体/修饰符(可选),其中修饰符是可选的。
实例：var patt = /runoob/i
11.js重定向
<body>
//都能激活提示框
<a href="javascript:alert('我是重定向的代码');">hellow</a>
<form action="javascript:alert('提交表单');">
<input type="submit" value="提交表单" />
</form>
</body>
12.判断
== 只判断内容,不管类型
=== 全等,既判断内容,又判断类型
!= 只判断内容,不管类型
!== 既判断内容,又判断类型
13.运算
（1）与运算(要求左右两边的条件都是true，结果是true)
var hd = 11>2 && 3>2;
（2）或运算(左右两边条件至少有一边是true,结果才是true)
var hd = 11>20 || 3>21;
（3）非运算(取反，真的变成假的，假的变成真的)
var hd = !(2>1);
（4）三元运算符/三元表达式
(条件)?条件为真的时候返回的值:条件为假的时候返回的值;
（5）转换数值类型
Number
parseFloat
parselnt
isNaNAN
eval
14.对象
（1）构造函数
<script type="text/javascript">
// 构造函数(类)
function ren(){
this.name = '名字';
this.sex = '性别';
this.height = '身高';
this.weight = '体重';
this.look = function(){
alert('能看见东西');
};
this.run = function(){
alert('能跑');
};
}
ren(ren);
// 通过构造函数实例化具体对象
var xiawa = new ren();
xiawa.name = '夏娃';
document.write(xiawa.name);
xiawa.sex = '女孩';
document.write(xiawa.sex);
var yadang = new ren();
yadang.name = '亚当';
document.write(yadang.name);
// 执行对象里的方法
yadang.run();
// 追加新属性和新方法
yadang.wenshen = '两只皮皮虾';
document.write(yadang.wenshen);
yadang.tree = function(){
alert('会爬树');
}
yadang.tree();
</script>
（2）遍历
<script type="text/javascript">
var auas = {
price:'8000元',
size:'15.6寸',
weight:'3kg',
color:'黑色',
game:function (){
alert('玩游戏')
},
chat:function(){
alert('聊天')
}
};
// x表示当前遍历到的属性的属性名字字符串形式,auas表示提用auas数组
for (x in auas) {
document.write(x+'=>'+auas[x]+'<br />');
}
</script>

向AI问一下细节

JavaScript入门基础

猜你喜欢

最新资讯

相关推荐

相关标签