写在前面的话
之前没有系统的学习过js,对于js仅有一些碎片化的了解,这次开始试着按部就班的学习一下。
课堂笔记1
下面是今天所学内容,都是非常简单的入门,所以叫做入门篇1。预计在两天内完成入门篇所有的内容。
1、基本内容:
插入js
<script type = “text/javascript”>
//jscode
<script>
引用外部js文件
<script src=”myjs.js”> <script>
//在js文件中不用再写<script>标签。直接写代码。
js在页面中的位置
按顺序执行。
语句与符号
注释
单行用//
多行/* */
变量
var a = 1;
//使用var来定义,类型会自动声明为数据类型。
判断语句
if(boolean){
//jscode
}
else{
//jscode
}
函数
function myFun1(){
/jscode
}
//使用 function 函数名(){} 来定义函数。通过在相应的地方写函数名() 来调用。
2、常用的简单方法
document.write(字符串/变量等,使用+连接)
//用于直接向html输出流写内容。alert([str]) 警告 消息对话框
//警告,弹出单按钮对话框,此时不执行下面的内容,等待用户单击按钮。独占。confirm([str]) 确认 消息对话框
//str为显示内容。该方法返回值为boolean类型,单击确定返回true。prompt([str1],[str2]) 提问 消息对话框
//str1为标题内容,用户不可修改,str2为编辑框默认显示的内容,用户可修改,在用户确定后返回该值。window.open([url],[name],[specs],[replace]) 方法 打开新窗口
//name指定target属性或窗口的名称(name),specs指定一些参数,例如全屏,宽高等。window.close()方法
//关闭页面,例如windows.close()关闭当前页面,mypage.close()关闭mypage页面。
课堂笔记2
今天是自学JavaScrit第二天,基本完成了入门内容。
1、给我控制权!
DOM:Document Object Model 文档对象模型。
在使用DOM解析html文档时,首先在内存中构建起一棵完整的解析树,即将所有的html中的元素都解析成树上层次分明的节点,然后可以对这些节点执行操作。
获取元素/元素组
通过id获取元素
document.getElementById(id);
//例如 var element1 = document.getElementById(“id1”);通过tagname获取元素组
document.getElementsByTagName(tagname);
//如果是*的话匹配所有元素。
//字符串不区分大小写通过name获取元素组
document.getElementsByName(name);
虽然可以通过document.getElementsByTagName(tagname)[3];获取第四个tagname元素,但是建议用id.
控制样式
有了上面获取元素(组)的方法,下面自然可以控制样式了。
元素标签之间的文本:obj.innerHTML;
背景颜色:obj.style.backgroundColor;
//注意,元素并没有背景颜色属性,只有style属性,而背景颜色属性是style的属性。
颜色:obj.style.color;
宽:obj.width;
……还有其他很多,就不说了。
设置是否显示
通过设置style的display属性的值来设置是否显示该元素
例如obj.style.display = “none”; //不显示
obj.style.display = “block”; //块显示
控制类名
元素的className属性控制或返回元素的class属性。
例如:obj.className = “div2”;
2、注意事项
相同的id最好只存在一个,否则会出许多问题
在使用id控制css样式时,注意对改变样式产生的影响。
课堂笔记3
今天是学习js的第三天,由于出了一些小事情,没有看多少内容。
1、操作符
逻辑操作符的逗比用法(Trick or treat !)
var a=5;b=6;
var result = a>b;
var result2 = !(a>b);
//result的结果为布尔类型的false
//result2的结果为布尔类型的true
操作符优先级(like c++、c#)
算数运算符>比较操作符>逻辑操作符(||、&&等)>”=”赋值符号
2、数组
一维数组
var myArr = new Array();
var myArr = new Array(66,80,90,77,59);
var myArr2 = [1,2,3];//sbjs为什么要用[]qvq
var a = myArr[0]; //a = undefined
myArr2[3] = 5;
var b =myArr2.length; // ->a = 4
二维数组(我突然想起了锯齿数组的噩梦)
var myArr = [[1,2,3],[4,5,6]];
var myArr1 = new Array();
myArr1[0] = Array();
myArr1[0][0] = 1;
引用资料
1.[头图] 【图片】 Mooc学院 JS学习