javaScript 入门
2017-10-14 10:18 晨曦曙光 阅读(320) 评论(0) 编辑 收藏 举报1.javaScript 在html中的位置
<script type="text/javascript">
javaScript 的代码写在< script></script>之间。
</script>
注意；script 标签可以放在<head>标签中，<body>标签中，也可以放在<body>标签外。
2.新建js 文件在HTML 文件中引入js 文件
a.新建JS文件，文件名为 js1.js 并在文件中写入要打印信息。例如：
alert("js1里面的信息");
b.在HTML文件中引入js文件
例如：<script src="js/js1.js" type="text/javascript" charset="utf-8"></script>
3.javaScript 文件中以英文状态下的";"结束。
4.javaScript 的注释
a.单行注释：//
b.多行注释 ：/* */
5. javaScript 变量的命名
定义变量使用关键字var,语法如： var +变量名
例如： var a=10;
变量名的命名规则：
a.变量必须使用字母、下划线(_)或者美元($)开始。
b.数字不能放在最前面。
注意:在js文件要区分大小写，变量要先声明再使用。
6.javaScript 判断语句（if...else）
例如：
var myage=18;
if(myage>=18){
alert("你是成年人");
}else{
alert("你是未成年人！");
}
7.javaScript 函数
基本语法：
function 函数名(){// function 函数的关键字
函数代码；
}
例如：
function add2(){
var sum=2 + 3;
alert(sum);
}
add2();//调用函数
8.document.write() 直接在网页上写内容
例如：
a .输出内容用""括起来，直接输出""号中的内容
document.write( "<p style=\"color: red;\">嘿嘿嘿！</p>" );
// style=\"color: red;\ 为字体设置颜色为红色
b. document.write(变量名);
c.document.write(变量名+"内容");
9. javaScript-警告（alert 消息对话框）
例如：alert("hello world");
10.javaScript-确认（confirrm 消息对话框）
语法：confirm(str) ;
例如：
function fun1(){
var res =confirm("你喜欢美女");
if(res == true){
document.write('喜欢')
}else{
document.write("不喜欢");
}
}
<input type="button" name="" id="" value="点我选择喜欢对象" onclick="fun1()"/>
11.javaScript-提问（prompt 消息对话框）
语法：prompt(str1,str2);
function fun2(){
var res = prompt("请输入姓名：","张三");
if(res == null){
alert("我是"+res);
}else if(res ==''){
alert("内容为空");
}else{
alert("我是"+res);
}
}
fun2();
12. javaScript-打开窗口（window.open）
例如：
function f_open (){
mywin= window.open('https://www.baidu.com');
}
<input type="button" id="" value="点击打开窗口" onclick="f_open()"/>
13.javaScript _关闭窗口（window.close）
a.关闭本窗口 window.close();
b.关闭指定窗口 窗口对象.close();
例如；
function f_close(){
mywin.close();
}
<input type="button" id="" value="点击关闭窗口" onclick="f_close()"/>
14.innerHTML 属性
innerHTML 属性用于获取或替换HTML元素的内容
<h1>hello1</h1>
<h1>hello2</h1>
<h1>hello3</h1>
<p id="p1" > I love JavaScript!</p>
<input type="button" name="bi" id="btn" value="点我改变P标签内容" onclick="change_p_content()" />
<script type="text/javascript">
var h=document.getElementsByTagName('h1') ;
alert(h[1].innerHTML);
//
// var p1=document.getElementById('p1');
// alert(p1.innerText);
function change_p_content(){
var p1 =document.getElementById('p1');
p1.innerHTML='我喜欢JAVASCRIPT';
// var btn=document.getElementById('btn');
// btn.value ='I love JavaScript!';
var btn1=document.getElementsByName('bi');
btn1[0].value ='I love JavaScript!';
}
注意：innerHTML要区分大小写
15.getElement的用法
/* getElementById 参数是 id 后面的值
* getElementsByName 参数是 name 后面的值 （input）
* getElementsByTagName 参数是标签名 比如 p span a h div
*
* 最后需不需要使用数组下标，就看是getElements 还是 getElement
* 复数就要下标取值。
* */
