黑马程序员技术交流社区
标题: 【厦门JavaEE就业1期-每日总结】JavaScript [打印本页]
作者: 厦门校区 时间: 2018-5-17 14:27
标题: 【厦门JavaEE就业1期-每日总结】JavaScript
本帖最后由 厦门校区 于 2018-5-17 14:27 编辑
同学们,以下是今日任务,以案例为主,在之后的学习中,JavaScript也是大家经常要操作的部分,所以认真总结。今日重点是熟悉JavaScript的基本语法,掌握定时器的使用,要求每位同学可以完成以下案例,然后以口语化的方式在评论区提交你的每日总结,谈谈你对今日重点知识的理解!
- 使用JS完成简单的数据校验
- 使用JS完成图片轮播效果
- 使用JS完成页面定时弹出广告
作者: 许大炮 时间: 2018-5-17 19:07
许剑鸿
webDay03总结
今天重点:JS→JavaScript;
js:js是一个使页面动起来的脚本语言 蹭java热度其实与java没有关系,只是语法与java类似又有其它不同,比如:js语句后边无所谓跟不跟";";
js由ECMA(就是JS基本语法及其它),BOM对象以及DOM对象;
今天所学JS中重点案列为:
1 通过定义触发事件(onload onsubmit...)并编写js(编写于<script></script>中),可以获得输入框中值并予以判断或各种操作;
2 实现图片的滚动(设定定时setinterval --获取图片对象 getelementbyid --改变图像地址)
3 实现页面中弹出广告并在一定时间后隐藏(setinterval/settimeout clearinterval)
↓ ↓ ↓
作者: 偏离X 时间: 2018-5-17 19:50
郭明杰:
javascript是可插入HTML页面的编程代码,代码区分大小写,变量的命名规则大概与java相似,不要跟关键字冲突即可.
数据类型分为原始类型:未定义型(underfined),布尔类型,数字,字符串,Object
引用类型:对象类型,默认值是null
JS的引入方式有两种,第一种通过<script>标签在页内直接填写JS代码,第二种在.JS文件中编写JS代码,通过<script src>调用
JS的运算符跟java基本一致,"==="全等运算符,在类型跟值都一致的情况下才为true,"=="只比较值.JS的语句基本跟java一致
开发步骤:JS通常都由一个事件触发, 触发一个函数,定义一个函数, 获得操作对象的控制权,然后 修改要操作的对象的属性或值
例如:操作图片步骤:创建一个HTML文件->当页面加载的时候开始计时,使用onload事件->编写inload事件触发的函数->
获得操作图片的控制权->修改图片的src属性
*定义函数的格式:
window.onload = function(){ }
function 函数名称(){ //函数体 }
常用事件(js Events):onclick,ondblclick,onmouseover,onmouseout
*设置定时的方法 setInterval() :循环执行,对应的删除定时的方法:dearInterval()
setTimeout(): 只执行一次,对应的删除定时的方法:dearTimeout()
confirm()弹出一个确认窗口
prompt() 弹出一个可输入的窗口
open() 打开一个新的窗口
[JS的显示和隐藏属性 ]*display="block"显示元素 display="none"隐藏元素
JS中的数组:JS的数组赋值方式跟java里面的差不多,不同之处是JS的数组没有指定长度
作者: rkko 时间: 2018-5-17 19:53
杜石苇
HTMLday3总结
今日学习了JS脚本的使用方法,比起CSS是美化页面 JS是让页面动起来.
JS的函数和java的方法有些相似,
var 可以定义 数字 字符串 对象等等 比如java的int String万能多了
JS的调用方法有两种 页面内调用和调用外部文件 <script> 或者 <script src="">
BOM对象
window:alert(),prompt(),confirm(),setInterval(),clearInterval(),setTimeout(),clearTimeout()
history:go(参数),back(),forward()
location: href属性
其中window对象属于bom最顶层对象,里面方法可以直接使用,不需要加window
JS运行逻辑 .
由事件触发函数(如window.onload 打开页面就触发)
然后触发的函数中定义函数 (如 在onload中定义方法 播放广告,轮播商品等等)
获取对象的操作权 (如定义var test =document.getElementById("id") 获取对象的操作权)
修改要操作的对象相应的值或者属性(如修改 test.style.display 修改bolck或者none)
onsubmit()此事件写在form标签中,必须有返回值。
onload()此事件只能写一次并且放到body标签中( 页头hert中也可以设置window.onload.设置后打开页面自动加载,无需在body中设置)
其它事件放到需要操作的元素位置。(onclick、onfocus、onblur)
获取元素:
document.getElementById("test") 翻译大概就是文件中获取用("test")这个ID来获取元素
获取元素里面的值:
document.getElementById("id").value
可以在script中定义方法 然后在标签中或者div中使用方法
今日的几个案例思路:
1: 定义加载广告的方法就是使用onload加载延迟 定义具体加载广告的时间 和关闭打开style中的display
2' 页面商品轮播的方法也跟广告差不多 加载广告基本设置一次性setTimeout(),轮播的设置循环setInterval() ,
最好加载的图片设置成有规则的 1 2 3 4 5这样.定义循环变量 i 大于最大值的图片就从新从i=1开始
3: JS做表单的变量原理也很简单 form中设置onsubmit()此事件写在form标签中,必须有返回值。
设置个ID JS中获取相应的值 然后判断是否符合正确数据的判断 不符合返回false 默认是true .
注意事项
另外 JS严重区分大小写 function 写成Function都执行不了. 还有引号要注意 比如 document.getElementById("username").value; 中uesrname要加引号
window.setTimeout("alert('test')",5000); 双引单引号避免错乱
今日单词
document:文档
check:检查
change:改变
Interval:间隔 循环'
Timeout 超时
history:历史
alert:警告框
confirm:确认框
prompt:输入框
function:功能(函数)
click:点击
back:返回
tips:提示
info:信息
onfocus:聚焦
onblur:离焦
location:位置
screen:屏幕
navigator:导航(浏览器相关信息)
作者: avip0000 时间: 2018-5-17 21:56
白有旺
JS
1.JS通常都由一个事件触发
2.触发一个函数,所以要定义一个函数
3.获取HTML对应的ID元素
4.对元素进行操作
引入方式:
1.页面内直接写 Script标签 跟Style 一样
2.引用,外部写一个.js文件 跟CSS一样引入<script src=""
事件
1.onsubmit 鼠标提交事件,一般用在表单
如在form里添加鼠标事件,在事件中添加函数 onsubmit = "return function();";
依赖一个返回值 ,可在函数前面用return来判断
对象
1.document
var 变量名 = document.getElementById("ID名称") //获取ID对应的元素
变量名.value 获取值.
轮播切换图片思路:
1.定义一个浏览器事件和函数,浏览器一加载就会执行
2.在函数内定义定时器,定时器前设置时间到了要执行的方法
3.调用方法
4.改变图片的地址 (前提是图片的地址是数字列 1 2 3 4) 如 src = "img/"+num+"";
其中num++ 判断(==最后一个数) 将num=1
表单校验:
1.需要借助 onsubmit提交事件 依赖return的返回值进行处理
2.对获取到元素的值就是判断
3.最后为false 记得return false
弹窗广告:
记得清理定时器
点击切换图片
1.在点击按钮处触发点击事件onclick并绑定一个函数
2.调用函数,原理跟轮播思路差不多
作者: 六道的骸6 时间: 2018-5-17 21:56
张裕
学习前端的第三天,前两天突然换开发工具不习惯,补敲了很多遍代码 总算开始熟练了.
第一天学习的HTML是用来做一个页面 第二天的DIV和CSS是美化页面
第三天的JavaScript则把之前的页面变的更生动了起来(动态化) 提高了学习的兴趣和乐趣
JS的基本语法跟java差不多 比较不同的地方就是变量类型了 JS只有 var 这一个变量类型 根据值来变化
JS的开发通常是通过一个事件来触发(例如鼠标点击 移动 按钮的点击等) 可以定义一个函数(方法)来通过事件触发
函数里可以通过 document.getElementByid("id名称") 获取指定ID元素的对象 来操作对象
可以通过window的定时方法来控制图片的显示时间(打广告)
setInterval();重复使用
setTImeout();只是用一次
清除定时
(根据需要清除的方法选择)
clearInterval()
clearTimeout()
CSS的显示和隐藏属性
display
block:显示元素
none:隐藏元素
表单元素的校验
在form元素中添加提交按钮事件 onsubmit="return 函数" 在函数中判断元素是否符合要求 默认返回true
在<head>中创建函数(方法)
通过getElementByid("id")获取元素对象 在获取value值做判断 记得写返回值
5月17日 fp没有出现的第N天
作者: LittleSky 时间: 2018-5-17 21:57
常小天
今天学习了javaScript,并利用JavaScript来使我们的页面更加强大。通过三个案例体现出JavaScript的功能。
案例一、注册页面的简单校验。作为第一个案例,本案例首先向我们展示了js的开发步骤。创建触发条件引用函数、定义或者声明函数、获取操作对象、最后修改或操作对象。需要注意的是获取对象获取的只是对象的一个壳子,对象的具体的值、属性以及方法还需要通过对象再去调用,这一步虽然简单但有可能会忘记做,所以需要注意一下。另一个就是onclick事件的特殊性,onclick事件调用函数必须要有返回值,并且在onclick的声明中应加上 “return”,在函数编写时同样注意不要遗忘返回值。
案例二、首页的图片轮播。这里有一个重点就是js的定时方法。定时方法作为js中最高层的对象window的方法,同样在使用时需要遵循js的开发步骤,即先要创建触发事件。需要注意的一点是在编写定时方法的参数时,其中的code部分,如果这一部分是一段代码而非方法名,要注意单引号与双引号的区分,否则容易出错。
案例三、广告页面的隐藏于显示。实现这一点依赖于定时方法和对象的style属性中的display属性。这一案例除了同样需要案例二中的知识和注意事项,还要全面地掌握window的定时方面的函数,也就是清除定时的函数,这里需要留意的是setinterval的返回值,这个返回值是清除定时方法用以定位待清除的定时方法的依据。
作者: 5119 时间: 2018-5-17 21:57
游荣辉
var是所有的数据类型,是个弱类型
事件的开头就是on
window.事件=function(){} 这是匿名函数
当你要设置时间
setInterval (想要实现的方法一定要加小括号,持续的时间) 持续播放
setTimeout (想要实现的方法一定要加小括号,持续的时间) 播放一次
然后重写要实现的方法.....
首先你要拿到控制权,document.getElementById("想要控制的id名")
用代码实现你想要的的方法
setTimeout()setTimeout 其实都有返回一个id值,你可以拿一个变量接收他,然后这个变量就可以
当作clearTimeout(变量) 的值来取消他
clearTimeout(no)是为了取消setTimeout()
javaScript的执行流程跟java的main方法很像,就是从上往下,从左往右,有方法就执行方法里的内容,
方法结束了在执行下面的内容.
作者: Eclipse启动 时间: 2018-5-17 21:57
郑阳阳
今天学习了JS,这是网页的脚本语言,可以让页面动起来.
JS的基本语法和Java差不多,我总结下不一样的.
JS的变量是弱变量类型语言,由值决定类型(都由var接收)
数据类型有undefined,number,boolean,string,null.
undefined是未定义的变量,number是任何数字的变量,boolean和java一样,String不分字符和字符串
其他运算符和语句基本和java一样.
JS由ECMAScript,BOM,DOM三部分组成.
基本语法就是ECMAScript里面的.
BOM对象有Window窗口对象,Navigator浏览器对象,Screen:屏幕对象,History:历史对象,Location:路径对象
Window对象最重要,包含了其他四个对象,
有八个常用的方法setInterval()按照指定毫秒来调用函数或表达式,setTimeout()按指定毫秒调用函数或表达式
clearInterval取消setInterval()方法,clearTimeout()取消setTimeout方法
alert()显示一个带有消息的警告框,confirm()显示一个带有消息和确认,取消按钮的对话框
prompt()显示提示输入的对话框,open()打开新窗口或已命名的窗口
作者: seilye 时间: 2018-5-17 21:57
叶身辉:
今天学习了JS 主要是可以使网页可以动起来,
例如可以实现一些图片的轮换,还有弹出广告等动态的功能,以及校验的功能;
Javascript有三种加载的方式,主要是直接写好js文件再加载进HTML文档,另外还有直接在HTML文档的头标签定义<script>标签,还有一种直接在<body>写入,
首先学习了js的基本语法ECMAScript,大体上和java一样,不一样的有var代表所有变量以及===代表类型和值全相等,以及还有一个undefined属于未定义类型null也可以是引用类型
在学习了BOM常用的window对象alert()弹出对话框confirm()弹出确认框setInterval()一直执行setTimeout()执行一次,还有document属性以及他的getElementById()方法可以根据id引用对象.
首先学习了校验的功能,在<from>标签内设置好action,method,onsubmit(return 方法),给每个变量都设置id和name,之后使用window.document.getElementById().value来获取每个变量,对每个变量进行判断,不符合要求的返回false,这样就能完成对数据的校验了!
还学习了图片的轮播功能首先给要轮播的图片设置id,然后再用onload调用window.setInterval(“方法1”,毫秒数),再将方法1写完整,用变量id获取要轮播的图片的对象将要替换的图片给该变量赋值,
还学习了如何加载广告,主要使用setInterval赋值给一个变量1使用onload加载到HTML,之后将广告的id赋值给一个变量2使用style.display=”black”;将广告弹出,而后使用clearInterval,将变量1关闭,再将要关掉的广告赋值给变量1,同样的方法使style.display=”none”;将广告关闭,在使用clearInterval将变量1关闭.
作者: 李思贤126 时间: 2018-5-17 21:57
李思贤:JavaScript和Java没关系,蹭热度的.JS可以把HTML页面动起来.
JS由DOM,BOM,ECMAScript构成
JS中变量都是弱变量类型,用var定义.
BOM对象中最常用的是Window对象,常用的有定时操作(setInterval()和setTiomeout()),
清除定时(clearInterval()和clearTimeout()); 弹框alert();
基本步骤,对准备操作的对象添加事件,常用有(onload,onclick,onsubmit,)
或者在<head>中添加<script>中直接用window.onload=function(){}触发function函数,在函数中先找到对象值,常用(document.getElementById().value),在进行操作
广告隐藏那部分,广告div元素属性display(none隐藏,block显示)
案例:校验那部分每一部分需要校验的都需设置ID.
onsubmit="return checkForm()" onsubmit比较特殊要有返回值
定时和清除定set和clear后面,如:clearInterval很容易弄错成clearImmediate(半天找不出错误…)
作者: Do1 时间: 2018-5-17 21:58
标题: 1111111111111111
本帖最后由 Do1 于 2019-9-1 01:56 编辑
111111111111111111111111
作者: it小白001 时间: 2018-5-17 21:58
吴俊斌
今天学习了javascript,这是一个游览器用的脚本语言,它和java是完全不同的,同时它还是个弱变量类型,所有的数据类型都可以用var定义.
使用JavaScript的方法有两种:
第一种:在头标签中使用<Script>标签
第二种:在外部定义一个.js的文件,在头标签使用<script>引入
JavaScript原始数据类型有number,String,boolean,null,undefined
还学习了JavaScript的bom,感觉bom类似java中的方法,同样bom也有一些常用的对象
最顶端的是Window对象,它的方法可以直接调用.还有一些常用的方法如alert,conform,
Open之类
还有一些其他的对象,可以查询api使用
作者: 李志勇 时间: 2018-5-17 21:58
李志勇:
javascript:
在JavaScript中变量都是用var来接收的
首先先学习了JavaScript的引用方式
<script></script>
<script src=""></script>外部定义js文件中
document.getElememtbyid()来通过id获取元素 都过获取的元素可以用来操作
onclick onload 等一些事件的触发来调用一些自定义的函数
都过学习setIntetval()函数可以用了制作滚动式图片
setTimeout()函数可以用来制作广告弹出 setIntetval()函数也可制作但是要加上clearIntetval()函数
alert()函数可以用了当做JavaScript检测使用
作者: 13163997058 时间: 2018-5-17 21:58
王刘锁
昨天跟朋友请教过说JS挺重要的,听了大佬的话今天必须好好听课!结果一天下来怎么感觉脑袋里一团
浆糊.在预习的时候就发现这个JS跟以前学的Java知识太像了.看了以后才知道原来他俩没有血缘关系
.根本就是两个完全不同的东西.当然既然不是一个东西就会有不同之处.
JavaScript和Java有很多的语法和规则的相似之处.而我们着重记的是他们的不同之处.js是脚本语言
用来对web和HTML做一些操作可以让网页页面变得动态
先来记录下今天一天的学习和案例练习中出现的小错误和需要注意到地方:
首先出现最多的错误并且为此浪费了很多的时间,在做案例练习的时候对语法的格式不是很清楚导致
很多的小细节总是忽略掉结果写完代码以后做不出来效果,一会要着重记一下语法格式
1,js和Java一样严格区分大小写(今天也犯过这个错误 该小写的写了大写)
2,js的语句结束时的分号可以省略 但是为了养成良好的习惯还是写上为好
3,js的变量和Java的变量命名规则一样 不能使用关键字(这个错误也犯过 把open作为了函数名 结果
一运行就会被widow调用它的open方法打开一个新的窗口,还查了很久的错误)js中的数据类型跟Java
大不相同 js中的变量的类型全部用var来定义 在Java中我们会明确变量的类型来接收数据,js中var
接收到的是什么类型数据它就是什么数据类型 这就是弱变量语言
js中的数据类型分为原始类型(undefined 未定义[没有声明或没有赋值或者变量不存在所返回的值]
boolean 布尔 number 数字[所有的数字包括小数] string 字符或字符串 null 空)和 引用类型(对
象 默认值是 null (这个null不是原始类型中的null))
js的运算符只要记住一个和Java不同的 "==="这个符号是当类型和值都相等才为true js的"=="符号
只比较值不比较类型,它会把类型转换为相同的 这个和Java不一样 Java中"=="在基本数据类型比较
的是值 在引用数据类型比较的是地址值.
下面就是犯错误最多的地方了(格式要重点记) window对象的方法 它的方法在使用的时候可以不用写
window
1,setInterval("show()",2000);第一个参数必须是字符串 意思是每2000毫秒调用一次show()方法
可以实现方法的循环调用 这边总是在调用的方法上忘记写括号.
2,setTimeout("show()",2000);这个是2000毫秒调用一次是只调用一次show()方法
3,alert();会在页面弹出一个框括号呢可以用字符串写上要在框内显示的内容.
4,confirm()弹出一个可以点确认和取消的框 可用于删除数据时的确认避免误删
5,prompt():弹出一个可已输入内容的框 可用于修改数据
6,open();犯过错误的地方 打开一个新窗口
今天必须掌握的内容:js的引入方式 两种
1.在head标签内定义一个<script></script>标签 在该标签内写js的代码
2.写一个.js文件 然后用是时候再HTML中引入js 格式是:<script src = ""></script>
js怎么使用? 我只知道要通过一个事件也就是一些人为操作或系统运行来触发函数
函数就是js的方法 在方法中可以获取想要操作的标签对象 通过document.getElementById("id")方
法来获取标签对象.通过对象修改属性
函数的定义格式也要重点记:
function 函数名(){函数体也就是方法体}
还有一种用匿名的方式定义的方法 相当于Java的静态代码块
widow.onload=function(){方法体}直接在页面加载时执行方法体(这边我也不太明白为什么这么定义
想了好久,)
常用的事件 onclick 点击某个内容 onload 页面加载时 onsubmit 提交按钮点击时
今天内容学的有些乱,还有一点就是总是不太明白js的引入和使用原理 好像卡在这个点上了 不知道
是不是这个原因导致今天学的很累!
作者: 376091692 时间: 2018-5-17 21:58
凌辉:
今天学习了javaScript
js是一门脚本语言,能使HTML页面动起来
js是弱类型语言,用var来定义变量
js是由ECMAScript,BOM,DOM组成
ECMAScript是基本语法和函数还有对象
BOM是由windom对象,Screen对象和History对象组成
DOM还没教;
今天比较重要的是alert()弹出对话框
setInterval()周期时间运行,setTimeout()时间内运行一次
clearInterval()清除时间,clearTimeout()清除时间
再然后就是确定事件,编写触发函数,运行页面
作者: 咸鱼coder 时间: 2018-5-17 21:58
万冕
js就是网页内的脚本语言,能让html更炫酷 js的代码需要用<script></script>括起来,但是js里面的变量是弱变量,所以类型的变量都是用var来接收,决定类型是由什么给var赋值就是属于什么类型的变量document.getElementById("需要获取对象的对象ID名");返回值是这个属性的对象,js里面的对象BOM,主要是window对象,由于window是最顶层的对象,类似于是超类,
里面的东西时,可以省略window. alert("");类似于java里的输出语句,只不过它是在页面里弹出一个提示框,延时setInterval
("需要调用的方法",延时多少毫秒触发) 所有的方法都需要有一个触发事件才能执行,onload="触发需要调用的方法"、oncheck(触发需要调用的方法)、等等都是触发事件,,其他的只要查查api都能看懂它的用法.所以今天内容也不是很难.还阔以.
作者: 沅瞻 时间: 2018-5-17 21:58
詹源
JS是运行在浏览器的脚本语言.JS的作用是让网页动起来,比如网页内图片滚动播放.
JS的基本语法与JAVA相似.===全等于是类型和值都一直才会true.JAVA是值.地址值或者具体数值.
JS数据类型分为原始和引用两种.
原始类型:underined 未定义类型
boolean 布尔类型
number 数字类型
string 字符或字符串
null 空(也可视为引用类型)
引用类型 对象类型.对象类型默认值null
JS的引入方式有两种:
一种是直接在<head>头标签中编写<script></script>
另一种是将代码编写到.js文件中,再在HTML中通过标签引入<script src =""></script>.
一般使用第一种比较方便.
(重点)JS的通常开发步骤为:
JS通过事件触发来定义函数,触发一个事件定义一个函数,获取操作对象的引用对象,修改操作对象的具体属性或者值
通过操作对象的ID来获得其引用对象.
获得的标签对象:document.getElementByld(操作对象id);
JS中定义的函数与JAVA中的方法差不多.触发了事件才会执行.
例如:window.onload = function(){
//函数体
}
function 函数名(){
//函数体
}
作者: wahahaha 时间: 2018-5-17 21:59
林恒山
js是一门脚本语言,js分为bom/dom/ECMAScript.它是弱变量类型的,因此不管是什么数据类型,它都只能写成var 变量=变量值,js可以把定义好的变量赋予不同类型的值.js的基本语法与java大致相同.
BOM主要讲5个对象分别是:window/Navigator/Screen/History/Location,window对象的常用方法有:setInterval()每隔多少秒执行一次函数,而setTimeout()则是过多少秒执行函数,只执行一次.清楚定时器的函数分别是clearInterval()和clearTimeout().还有alert()弹窗显示字符串,confirm()弹出确认窗口,prompt()弹出可输入的对话窗口,open()则是打开一个新窗口.Location里面别叫重要的是href属性,可以跳转到其他页面,跟a标签的作用一样.其他3个对象在要用到的时候会查询api即可.
js的引入方式有2种,一种是页面内编写js,另外一种则是写个js文件,在需要的html页面使用script标签的src的属性引入.常用的事件有点击onclick,双击ondblclick,页面加载onload,鼠标移动到上面onmouseover,ommouseout鼠标离开等,定义函数有2种,function 函数名(){};另外一种匿名,比如onload=function(){}.获取元素对象的控制权主要是通过document.getElementById().修改元素对象的属性或值,这就是js开发的步骤.
作者: 张述明 时间: 2018-5-17 21:59
张述明
今天学习的是JS,JS主要有以下以下三个部分组成
js的基本语法,bom,dom
它的的基本语法和Java差不多,有一些方面是不同,比如js是弱变量类型语言,所有变量又可以用var接受,是先接收变量,后确认变量类型..
Js的数据类型包含undefined,Boolean,numberString,null;用法和java差不多.
运算符有一个不同的地方就是它有一个全等运算符,是变量类型和值都相同才会返回一个ture.
js的开发步骤是另个比较重要的地方,它是通过一个事件,去触发一个函数,事件主要组成的比如onload,onclick,ondbclick等等
js的引入方式有两种一种是在外面定义一个js文件,然后在html中引入;另一种是在页面中head <script>内容</script> 中输写内容
除此之外今天主要学习三个案例
第一是注册框的校验 在<form onsubmit”return check()”>,然后在<script>function check()
{ 通过 document.getElementbyid();获取元素,然后进行需要的判断和修改
}</script>
第二和第三有点相似就是图片的滚动和广告的弹出
主要用到的是时间的设置,用的方法是window中的setinterval();
设置完时间,通过document.getElementbyid();获取元素,图片的可以获取它的src来进行更换图片从而达到滚动播放的效果,
广告的弹出需要在div或者图片中设置display属性 none就是屏蔽 block就是显示
然后再用的方法是window中的setinterval();
设置完时间,通过document.getElementbyid();来解决这个问题,,另外可以通过设定var time,来清除时间的设置
作者: Yanmo_ 时间: 2018-5-17 21:59
颜琳琳
今天学了JS,JS是一种用于浏览器的脚本语言.由:ECMAScriot,BOM,DOM组成.
Js主要学习了其语言的语法,该语法和Java语言基本相同,其中不同的有1. ECMAScript的原始类型有:undefined类型: 未定义的值;boolean类型;number类型;String类型 字符或者字符串类型;null类型可看成是引用类型中的对象的默认值; 2. 变量,该变量是弱变量类型,类型为var代表任意类型; 3. 运算符,该运算符中的”==”表示值相同,”===”表全等,数据类型和值都相同的.
今天主要通过学习使用JS实现注册校验,使用JS实现图片切换和使用定时弹出广告三个案例来学习JS.
1.使用JS实现注册校验案例中学习了,Js的开发步骤和引入方法;
在开发步骤中要注意在创建html页面后必须要有个触发事件,如果是使用form表单提交,则要在form标签中添加onsubmit="return checkForm();"(return后面为触发事件的方法名/函数名)作为触发事件,然后在<head>标签中定义一个函数,在定义该函数时候需要有<script>标签内,定义函数的格式为
window.onload= funtion(){ 函数体 };(该方法页面只加载一次)
funtion() 函数名{ 函数体 };
常用的事件有:onclick,ondbclick,onmouseover,onmouseout,onload,在进行校验时需要通过ID来获取,document.getElementById("").value来获取要校验的值来进行对象的控制,然后使用if进行判断,最后还需有一个布尔类型的返回值.在校验中要注意邮箱的校验比较特殊,需要用到正则表达式来判断,获取的方法有两种:1. 使用String对象中的match方法 定义的id名.match(“正则表达式格式”); 2.使用正则对象中的test对象 正则表达式格式.test(定义的ID名)
引入方法有:1. 直接在页面内的<head>标签中定义<script></script>
2.在外部创建一个.JS文件,然后在html页面中导入即可.
2. 使用JS实现图片轮播和弹出广告的案例,该案例中学习了BOM中的对象有window对象,该对象中常用方法有: 1. setInterval(“要调用的函数或要是执行的代码串”,要执行的时间单位为毫秒)循环执行, setTimeout(“要调用的函数或要是执行的代码串”,要执行的时间单位为毫秒)执行一次, clearInterval()取消setInterval设置的时间,循环执行,clearTimeou()取消setTimeout设置的时间,只执行一次; 2. alert() 弹出一个窗口; 3. confirm() 弹出一个确认的窗口; 4. open() 打开一个新的流浏览器窗口 , 5. prompt()显示提示用户输入的窗口; Naviqaitor对象 包含浏览器信息 ,Screen对象 用来获屏幕信息 ,History对象 浏览器的历史记录 ,Location对象 获取URL信息 使用href=””. 注意:window是所有对象的属于BOM最顶层的对象,需掌握其方法,其他对象了解即可.
这两个案例开发的代码如下:
<script>
var time1;
window.onload=function(){
//设置定时
window.setInterval("changeImg()","5000");
time1 = window.setInterval("show()","5000");
}
var i=1;
function changeImg(){
i++;
//获取图片的控制权
if(i>3){
i=1;
}
var img1=document.getElementById("img1");
img1.src="img/"+i+".jpg";
}
//显示广告方法
function show(){
//获取广告的div元素
var time=document.getElementById("adDiv");
time.style.display="block";
window.clearInterval(time1);
time1 = window.setInterval("hide()",5000);
}
//隐藏广告
function hide(){
var adDiv=document.getElementById("adDiv");
adDiv.style.display="none";
window.clearInterval(time1);
}
</script>
作者: 名字被人注册了 时间: 2018-5-17 21:59
刘文峰
javascrip是一种浏览器脚本语言,它与java并没有关系.它可以让我们的页面变成动态的,JavaScript有内部引入(<script> 这里是函数 </script>定义在html文件内)和外部引入(新建一个js文件,文件内编写函数,通过在html文件内用<script scr=”js文件的路径”> </script>引入)两种方式.
JavaScript通常由事件触发一个函数,我们可以定义这个函数,然后通过标签的id获取要操作的标签的对象,接着就可以用对象对标签的属性进行修改,进行我们想要的操作.
作者: 李志勇 时间: 2018-5-17 21:59
李志勇:
javascript:
在JavaScript中变量都是用var来接收的
首先先学习了JavaScript的引用方式
<script></script>
<script src=""></script>外部定义js文件中
document.getElememtbyid()来通过id获取元素 都过获取的元素可以用来操作
onclick onload 等一些事件的触发来调用一些自定义的函数
都过学习setIntetval()函数可以用了制作滚动式图片
setTimeout()函数可以用来制作广告弹出 setIntetval()函数也可制作但是要加上clearIntetval()函数
alert()函数可以用了当做JavaScript检测使用
作者: Nevermo 时间: 2018-5-17 21:59
许煜 每日总结
JavaScript 页面脚本语言 与Java语言相近但是两者除了名字以外并没有什么关系
常用事件 onclick 单击 ondbclick双击 onmouseover鼠标悬浮 onmouseout鼠标移过
onload 加载
Js与java比起来特殊的运算符(===)数据相等 类型相同时为true
重点:
JavaScript是一门弱变量类型语言(就是定义变量时并没有决定变量具体数据类型,给变量赋值时决定变量具体数据类型) 定义变量统一用 var(variable)
数据类型
原始类型:undefined(例如 var i 定义变量i 没给具体数据类型) boolearn number string null
引用类型 对象类型(默认值是null)
表单数据处理
在form标签设置submit事件触发函数然后通过触发的函数来处里表单数据
<script>标签用于写JavaScript代码 function 函数名(){}:用function创建具体函数(与java不同的地方在于不用考虑函数是否有返回值 统一用function 触发某事件如果需要返回值的话就直接在函数中使用return返回一个数据即可)
函数与表单可以通过表单的id属性建立联系 为表单设好id 然后通过document类的getElementsById(“id”)方法获取表单(或者可以说是创建表单对象),然后调用属性如value获取属性值.最后就可以根据各个表格的数据要求对获得的数据进行处理.
关键内容 docume.getElementById(“id”)通过标签的id属性获取元素
submit触发的函数需要返回一个布尔值(true表示提交form, false表示不提交)
alert为window类的一个方法,作用是弹出一个窗口,输出指定内容.window.alert(window可省略)
正则匹配的两个方法1: string.match(正则表达式) 2:正则对象.test(正则表达式)
图片滚动案例
触发函数,函数内容为每过多少毫秒通过getElementsById获取图片对象,然后更换图片src属性即可实现图片滚动
关键内容: onload加载时触发事件
window.onload=function(){}事件触发时直接调用函数.
window.setInterval(函数,时间 ) 周期性调用函数,周期为设置的时间.(循环调用)
settimeout(函数,时间)经过一段时间后调用一次函数(只调用一次)
实现图片轮播:(三张图片循环)
1案例的方法 var i=1;
If(i>3){ i=1};
Img.src=img(i).jpg;
i++;
2 我的方法 var i=1;
Img.src=img(i%3+1).jpg;
i++;
总之就是通过定义局部变量和循环调用函数实现图片轮播
广告弹出案例
设置display为不可见的图片 通过事件触发调用函数将图片display属性修改为可见实现弹出图片广告 在通过同样方法将广告隐藏
关键内容:display=none(不可见) display=block(可见)
在同一个网页 window.onload只可使用一次 但是window.setinterval可多次调用 window.setinterval(函数,时间) 经过一定时间 调用函数,函数主要内容是获得广告图片所在div并将属性从none修改为block即能将广告弹出
Clearinterval cleartimeout 清理之前设置的setinterval 和settimeout
作者: 铁木啊童臂 时间: 2018-5-17 21:59
汪志阳:
JS与java的比较:
相同点:变量,函数,运算符等区分大小写;运算符(除了===)基本一致
注释方法,代码块,变量的命名合法要求,关键字基本上一样
不同的:变量声明不一样(var +变量名)
JS的数据类型:原始类型(undefined:定义未赋值类型;boolean布尔类型;number数字类型;String:字符或字符串类型;null:空)
引用类型:对象的默认值为null
Js的引用步骤:通常以一个事件触发,触发一个函数,然后定义一个函数获得对象的控制权
引用的第一种方法:在bread中的script中直接编写函数window.onload=function(){
//类似于java中的静态代码块 }
引用的第二种方法:在标签上定义事件,在script中编写函数function 函数名(){ }
常用事件:onclick,ondblack,onmouseover,onmouseout,onload...
JS的引入方式:页面内直接编写js代码,代码需要使用在head内的<script></script>
以简单检查登录页面数据合理性为例子:
1.form:事件 onsubmit触发函数checkForm()
2.在head中创建script,创建函数
3.在函数中获得对象元素,通过document对象方法(id)获取对象的值
4.做判断,alert提醒框,return false
setInterval的返回值可以作为clearInterval的参数
window在的常用方法:
confirm:弹出确认对话框
prompt:弹出可输入的对话框
open:打开一个新窗口
方法的使用举例:在body中定义事件:<input type="button" value="删除" onclick="del()" />
在bread中的script中编写函数
function del() {
confirm("确定删除吗")
}
总体来说今天的JS就是让之前的页面动起来的操作,主要记住事件触发函数.和java没半毛钱关系,虽然名字有部分相同.
作者: 厦门黑马王子 时间: 2018-5-17 21:59
郑雪平
今天主要学习了javaScript的一些功能,比如:使用function checkForm(){
var name=document.getElementById("name").value;
if(name==""){
alert("用户名不能为空");
return false;
这个方法就可以进行简单的数据校验; 下面代码中的return我忘了写上,由于JS数据没JAVA严谨,红色处需要返回boolean类型值,但是下面黄色标记的那个return没写居然也可以正常显示结果,不过导师建议我们要写上,不然其他地方有可能会出错.
<form onsubmit="return checkForm()"> 这里是一个触发事件,忘记写的话即使其他的代码都写对也是运行不了.
<table border="0" width="100%" cellspacing="10px">
<tr>
<td>用户名</td>
<td><input id="name" type="text" name="username"></td>
还有就是通过window.onload=function(){
window.setInterval('alert("bbb")',5000);
}这句代码就能实现定时弹出广告窗口并显示里面内容的功能,前提是要先写<script type="text/javascript"> </script>
作者: 望蜀 时间: 2018-5-17 21:59
邵倩
JS即JavaScript 是最常见的运行在浏览器端的脚本语言,虽然名字里带Java,实际上和Java语言没有关联,蹭热度emmmm...
JS可以使页面动起来 还可以实现验证表单,检测浏览器等功能
JS可由所有浏览器执行
JS引入方式1.页面内<head>部分中直接编写JS代码 <script> </script>
2.将JS的代码编写到一个.js的文件 在HTML中引入 <script src="xxx.js"> </script>
JS的组成:
1.ECMAScript--JS的基本语法(JS的核心)
2.DOM 文档对象模型 用于获得HTML页面文档中的信息
3.BOM 浏览器对象模型 用于获得浏览器中的相关信息
JS的基本语法:
区分大小写
分号可有可无 建议加
JS属于弱变量类语言,即变量没有具体类型,给他赋的值是什么类型变量就是什么类型,所有变量都用var运算符来定义(var s="略略略" var i=123),区别于Java(String s="略略略" int i=123)
一个var可以定义多个变量 var x=1,y=2,z=3
Java数据类型:1.基本数据类型(四类八种) 2.引用数据类型
JS的数据类型:
1.原始类型5种:undefined,boolean,number,string(字符或字符串),null(返回object)
2.引用类型 对象类型,默认值是null
JS中 变量名与Java一样不能用关键字命名,很多关键字类似于Java语言,注释和Java一样可以用//或/* */
JS中的运算符与Java基本一致 JS中有个 === 全等号 类型和值都一致才为true
JS语句与Java语句一致 如 if else while for break
开发步骤:
JS通常由一个事件触发,触发一个函数,定义一个函数,获得操作对象(标签)的控制权,修改要操作的对象的属性或值
定义函数的两种方式:
1.function 函数名称(){
//函数体
}
2.匿名函数
window.onload=function(){
//函数体
}
常用事件:
单击onclick 双击ondbclick 鼠标放在上面onmouseover 鼠标移开onmouseout 页面加载onload 提交onsubmit依赖于返回值 true时才提交
注意:window属于bom最顶层对象,其中的方法可以省略window, window.onolad只能有一个
作者: COLDER 时间: 2018-5-17 22:00
本帖最后由 COLDER 于 2018-10-18 19:12 编辑
Day03
JavaScript:运行在浏览器端的脚本语言,作用:使页面具有动态的功能,与Java无任何关系!
今天学习内容分为以下几点:
一.JavaScript的基本语法:与Java对比有相同之处,也有不同之处,
不同之处为以下几点:
1.JavaScript的数据类型只有var,数据类型分为原始类型(undefined,boolean,string,number,null)和引用类型(对象,默认为null)
2.JavaScript新增运算符"===",判断数据类型和值是否相同
二.DOM(文档对象模型):Document对象方法:Document.getElmentById(),注意方法中语法格式的大小写!
三.BOM(浏览器对象模型):Window对象方法(重点):
1.alert():弹出对话框
2.setInterval()/setTimeout():设置循环/一次定时
3.clearInterval()/clearTimeout():清除定时
四:JavaScript的引入方式:
1.页面内编写:<script></script>,在body或者是head位置使用
2.外部页面编写:head位置,<script src = ".js文件地址"></script>
五:JavaScript的开发步骤:
1.由事件触发(onclick(单击事件),onsubmit(提交事件),onload(加载事件)...)
2.定义函数方法:(定义函数方法均需要以function为前缀)
匿名格式:window.事件名 = function() { //函数体 }
函数名格式:function 函数名{ //函数体 }
今日课堂案例问题点:软件无编译报错功能,在使用语法上漏掉引号等一些无明显的错误导致产生异常.
-
智能截图 1.png
(119.95 KB, 下载次数: 8)
作者: 一梦 时间: 2018-5-17 22:00
陈世彪:
今天学习了JavaScript
JS是用来是浏览器脚本语言,使网页灵活起来
JS中变量的接收都是用var来接收的,JS当中的语法上的东西和java十分类似
window属于bom的最顶层,常用的方法有:
setInterval(“change()”,5000);隔多少毫秒执行
clearInterval清除
setTimeout(“change()”,5000);隔多少毫秒执行一次
clearTimeout清除
alert() : 弹出对话框
prompt("显示的文字",默认值);弹出一个可输入的对话框
open("域名","","width,height");打开一个新窗口
JS的两种引用方式两种:<script src = ""></script>
普遍使用 <script> 函数 </script>
window.onload = function(){ 就像静态代码块,优先执行这个
// 函数体
}
作者: sts 时间: 2018-5-17 22:00
苏海斌
JS是一种脚本语言能够让页面动起来,由JS基本语法(ECMAScript),DOM,BOM组成.其中变量都用var来接收,即所谓的弱变量类型语言.
Js的数据类型也是一个重点,区别跟Java差不多,
JS运算符也是,该注意的是有个===全等于,即类型和值都一致;
BOM是个次重点,但是常用方法跟其他内容单词太多,优先掌握方法,其他的可通过API了解.
在JS中方法称为函数,也是通过调用执行.
获取标签对象:document.get
(今天的内容基本理解,有两个问题:案例会有方法嵌套的错误,以及调用的关键字未掌握(快捷键无法生成是关键>_<))
作者: 2902 时间: 2018-5-17 22:00
张清才 5-17(javascript)
js一种运行在浏览器的脚本语言,和java语言没有关系,但是语法等和java有很大的相似.
Js是让网页动起来的语言,通过js可以让网页更加炫酷.
Js由 ECMAScript(语法) ;BOM;DOM三部分构成
语法:
变量都是弱变量 定义和接收任何变量都用var;类型分为原始数据类型(undefined;number;boolean,string,null)和引用类型
重点是通过对象调用其方法,达到我们想要的效果,
window对象--window对象是bom对象中最重要方法最常用的对象
alert() 弹出一个框,括号内可以是字符串,也可以是表达式,js因为没有像java那样有报错功能,所以把alert()放在开头可以用来检测 程序是否执行到当前位置,来确定发生错误的地方,方便我们检查修改.
Confirm() 打开一个确认窗,可用与提示;open()打开一个新的网页窗口,相当于一个超链接;
Navigator() 浏览器对象 方法用于得到浏览器的各种数据
Screen()屏幕对象 用于得到屏幕的各种数据
History:历史对象 用于查看浏览器当前页面的前后浏览过的网页,三个方法,记住go()加上数字就可以跳转到前前后后的网页了
作者: w849027724 时间: 2018-5-17 22:01
吴利君
今天学习了js
js是脚本语言,它总共有三个部分,ecmascrip bom dom这三个,其中ECMAscript是js的基础代码部分,一般定义参数都是var 名字 = 参数,参数类型我java的
8大基础类型,它会自动弄类型,其中,正则表达式为String的match和test。
然后是bom,这里就得介绍控制时间的两个函数,setinterval和settime这分别是周期的和一次性的。主要用于随时间变化的属性,比如轮播图,定时广告等。可以使用clear***来清除这个时间。
注意,这些要用在windos对象里面。然后是四个很方便的函数,alert和confirm等,这个给一个可以用来差错,另一个可以用来确认,很好用。
然后是js获取数据的方法,分别是document.get....这些可以根据的设置的属性进行获取值!
当然,你也可以使用js对网页进行标签插入!使用innHTML这个方法!
总之,今天学习大概这样,其中还有一些方法略过,但是那些方法也是很好用的!
作者: wpwing 时间: 2018-5-17 22:01
吴鹏
----------------------------------------------------
用js实现简单的文本框内容是否为空的案例:
一,对于每个需要判断的文本框元素,在其标签内分别定义不同的id值;
二,在需要检测的表单的<form>便签里边使用onsubmit="return 函数名",这个属性根据返回的true或者false来决定表单是否提交;
三,在<head></head>里面写<script></script>,之间定义一个函数,该函数的内容为
1 获取不同id值的对象的数值内容,
2 对数值内容进行判断,判断是否为空,
3 若数值为空,则使用alert()弹出提示,并且返回false,
4 因返回的数值为false,所以表单无法提交;
5 注意,对于邮箱地址,不光判断是否为空,还需判断是否是正确的邮箱格式,
可以使用字符串对象的match()或者正则表达式的test()方法来进行判断,形如:
邮箱地址.match(邮箱地址的正则表达式)
邮箱的正则表达式.test(邮箱地址)
6 对于密码,还需比较两次输入的内容是否相等;
----------------------------------------------------
循环显示图片的实现:
一,定义一个事件:因要求图片每隔一段时间后就改变,所以使用window.onload = function(),内部方法使用window.setInterval("",毫秒数值),
该方法为每隔毫秒数值,循环某个对象;
二,定义一个函数:定义一个改变图片的函数,函数名使用changeImg();
三,获取控制权:使用变量接收要改变图片的元素,
四,对文件进行修改:因要实现图片的自动改变,因此使用一个变量,用变量i关联文件名,
同时变量i在每次循环后都进行累加,判断当超过图片上限的数值后,重置变量i,使其从第一张开始重新输出;
---------------------------------------------------
实现图片显示及经过固定时间后隐藏:
对于这个要求,可以定义一个<div></div>块,将图片内容放在div块里,直接显示或隐藏div块;
一,div标签内先定义id=adDiv,再用style属性的display的none方法,隐藏div块,
二,
var time;
var time1;
window.onload = function() {
time = window.setInterval("show()",2000);
clearInterval()方法需要接收一个返回值,用来确定是哪个对象要调用这个方法,在这里使用全局变量time接收;
}
function show() {
var adDiv = document.getElementbyId("adDiv");获取到图片块对象
adDiv.style.display="block";对图片进行设置,使图片显示出来
window.clearInterval(time);根据返回值,将给定time返回值的setInterval清除;
time1 = window.setInterval("hide()",3000);调用hide()函数,将图片进行隐藏,使用变量time1接收此方法的返回值;
}
function hide() {
var adDiv = document.getElementbyId("adDiv");
adDiv.style.display="none";
window.clearInterval(time1);根据上面的time1返回值,结束hide()循环;
作者: q55w66 时间: 2018-5-17 22:02
JavaScript
{
1.和Java没半毛钱关系的脚本语言
2.可以让页面动起来
组成部分
{
ECMAScript(JS语法)
DOM
BOM(浏览器对象模型)
}
}
今日主菜:动作触发事件,事件调用函数,函数获得对象的属性或值并对其进行修改
模板举例:onclick(点击事件)
流程:
Ⅰ鼠标点击按钮,触发事件onclick
Ⅱ事件调用函数onclick="method()"
Ⅲ函数拿到目标对象的属性或值,然后进行修改
method()
{
(获取对象的方式多种多样,这边通过id进行获取)
var obj=document.getElementById("(对象的id值)");
(对对象中的属性或值进行操作)
obj.value=100;
}
可套用今天的案例对以上段落进行修改,例如
Ⅰ<form action="" method="post" onsubmit="return checkForm();">
在点击注册按钮(动作)<input type="submit" value="注册" />时触发事件onsubmit
Ⅱ事件调用函数onsubmit="return checkForm()
Ⅲfunction checkForm()
{
var username = document.getElementById("username").value;//根据id拿到 id="username"的对象
if(username == "") {
alert("用户名不能为空");
return false;
//对 对象的属性值进行操作
}
今日配菜:多种事件,多种函数,详情见W3School
作者: 小故事 时间: 2018-5-17 22:03
谢洪彬:
今天学习了javaScript
作用 : 可以在浏览器运行的脚本语言, 让页面 蹦虾卡拉卡(动起来) ,更加丰富
javaScript的学习主要分以下三块:
核心 : ECMAScript :基本语法
DOM : 浏览器对象模型
BOM : 文档对象模型
语法与java特性基本相同,也有一些不同点 如下:
1.变量:,(弱变量类型语言)
var没有具体类型,赋的值是什么类型就是什么类型
2.数据类型:
2.1原始类型
五类原始类型, 查API
2.2 引用数据类型(也称对象类型)
3. 运算符
===(全等) ==(默认完成类型转换 只比较值,不比较数据类型)
使用===判断类型和值都一致才返回true,否则返回false
Js的通常开发步奏
1.通常由一个事件触发
2.触发一个函数,定义一个函数 关键字:function
3.获取操作对象的控制权 关键字: document
4.修改要操作的对象
定义函数:
Function 函数名称(){
函数体
}
匿名函数:
Window.onload=Function(){}
函数名不能随意起,有些函数名可能是关键字,会影响到程序正常执行(课上有出现 过此类问题)
常用事件:通常以on开头的
比如: onload 程序加载则加载
onclick 被点击时加载
Js的两种引入方式
在<head></head>中定义使用<script></script>中实现
定义一个.js文件引入
Js校验正则: (正则表达应当正确,否则会影响到其他代码校验)
1.String.match(正则表达式)
2.正则.test(字符串)
Css的显示和隐藏
Display下的:
block 显示元素
none 隐藏元素
Window为最顶层对象(父类)
其中一些常用的方法:
alear --弹出一个对话窗口
setInterval() --设置时间,执行多次 (还有其对应的清除方法)
serTimeout --设置时间,只执行以下 (还有其对应的清除方法)
Confirm --弹出一个确认窗口 (确认 ,取消)(true ,false)
Prompt()--可以用于修改价格
Open() --打开新的窗口(可以设定制定窗口大小)
NaVigator:获取浏览器相关的
Screen :主要用于获取屏幕相关的
History:主要获取浏览器历史相关的 -- (Go()方法中参数传的是数字)
Location:包含URL路径相关的 -- (Href:跳转)
作者: 厦门陈强 时间: 2018-5-17 22:04
陈强
JS的一天,新的语法,其实明确一个使用的步骤并不难理解的.
使用步骤:一个事件触发---需要触发的函数---定义函数---获取操作对象的控制权---进行判断或者其他操作.
针对三个案例而言,其实步骤都是差不多的:
给要操作的对象设置一个ID,在<script>标签中去定义一个函数,然后根据ID去获取对象,根据对象获取其值,然后根据值进行一些操作,在<form>标签中去调用方法执行即可.
差别只是触发的事件不一样,有的是onsubmit , 有的 onclick ,有的是 onload ........
关于轮播图片,就是需要图片的路径需要用变量去控制
关于定时广告,就是要设置一个display的值.
作者: 滴滴eclipse启动 时间: 2018-5-17 22:25
江某人:
今天学习了js 这是运行浏览器端的脚本语言,可以让页面更加炫酷,让页面动起来
js要记住的是这门语言区分大小写 是弱变量类型语言(变量都用var来接收),不能用关键字作为名字
变量命名与java挺相似的
还有 null:空 是原始类型也可以称为引用类型
JS的运算符 注意 : === 全等于.全等于是类型和值都一致的情况下才为true.
页面内直接编写JS代码,JS代码需要使用<script></script>
Window对象的定时操作:
在<head>里
<script>
function setTime(){
//只出现一次
window.setTimeout("alert('aaa')",3000); 写在<body>里 <body onload="setTime()">
//每隔三秒出现一次
window.setInterval("alert('aaa')",3000);
var i=1;
if()
} </script>
正则表达式的两种使用方法:
JS校验正则表达式就有两个方法:String对象中的match方法,一个是正则对象中的test方法.
str.match("正则表达式"); 正则.test("字符串"); 都不要加双引号
作者: 渣.. 时间: 2018-5-17 22:49
柯威龙
js是一种运行在浏览器的脚本语言.他与java并没有关系.使用js的话会让页面动态
化,看起来的话更加酷炫.js的组成主要由三部分组成.一是DOM 二是BOM 三是js.
js的组成有基本语法,内置对象(没搞懂),和函数(我觉得就是方法).
语法里有一个弱变量,var 然后想给他什么类型的话就在后面打什么类型的属性.
数据类型分为基本数据类型和引用数据类型.在这两种类型里面有一个null比较特殊,
它既是基本类型,也是引用类型.
js的对象好像都是单词,只能去手册里面查.
对象就是BOM包含了Window 窗口对象只记得alert是带有消息的确认按钮.
setIntervall每过多少毫秒循环弹出一个对话框setTimeout 每过多少 毫秒只有一次弹出对话框
go 加载具体某一个页面,剩下的只能用手册查了.location是路径对象.
函数的也就是方法知道用function调用方法,通过标签id获取标签对象,但是不知道里面有些属性该怎么写,还在了解中
作者: 追风筝的人哇 时间: 2018-5-17 22:56
康元中
今天学习javaScrip
js 是一种脚本语言和java没有关系 可以是一个页面动起来
js 三个组成分别是
ECMAScript (这是js的基本语法, 特点是和java 语言基本语法相似)
不同点有 a js是弱变量类型语言 var
js数据类型 分为原始数据 -5种 null undefined(未定义类型)
引用数据类型 对象类型默认null
=== 全等于: 类型和值都一样才为true
BOM Window 对象里面常见方法 setInteral()
confirm()弹出一个确认对话框/
prompt()弹对话框/
open()打开一个新窗口
其他对象 NAvigator ......
javaScript 重点
js引入方式 和css 引入方式相似 一种是 页面内写<scipt> 代码</script>
另一种 外部定义一个.js 的文件 在.js的文件里写
开发步骤 ;
事件: onload / onclick/ ondbclick/ onmouseover/ onmouseout....
定义函数 方式两种
1 function 函数名(){
函数体
}
2window.onload= function(){
函数体
}
作者: zzx835387607 时间: 2018-5-17 23:13
今天学习了JavaScript 是由网景开发的,运行在浏览器的脚本语言.
目的;让整个页面更加酷绚
与Java没有任何关系,所有的变量由var接受,(区别与Java)
===比较的是类型及属性值.
CSS的显示和隐藏的属性】* display * block:显示元素 * none:隐藏元素
案例一(数据的校验) 解题思路
第一步 现在原始的代码中 添加id
第二步再利用
var uvalue = document.getElementById("username").value;
Document 对象是 Window 对象的一个部分,document来调用getElementById获取id的值,.value获取输入的值 用以一个var来接收
第三布利用if语句判断,在用alert()来弹出窗口
案例二 (广告轮播)
解题思路
1.要滚动的地方定义一个id
2.利用script调用此id
3.window.onload=function(){定时器}
4.定时器格式为window.setInterval("changePhoto()",5000 );
5.changePhoto()是一个方法.
案例三弹出广告
解题思路
1.在body区建立一个div 添加广告途径 令display 默认为none.
CSS的显示和隐藏的属性】
* display
* block:显示元素:
* none:隐藏元素:
2.
2.window.onload=function(){定时器}
3.定时器格式(开始)time=window.setInterval("statr()",5000);5000为毫秒值
定时器格式(结束)time1=window.setInterval("over()",10000);10000为毫秒值
编写开始的方法与结束的方法
adDiv.style.display="block"; abDiv是一个变量,style该变量的属性值,在两用display
作者: hpb199567 时间: 2018-5-17 23:15
何平波
今天又学了新的知识----JavaScript(简称JS).
JS是一种网页脚本语言,它是属于web的语言,如果说html语言是一个人的话,css语言就是为他美化外观,而JS语言就是赋予它动作,让人(网页)更加的面向对象.
JS是可插入的HTML的编程代码,它能让所有现代的浏览器解析执行,今天要掌握三个重点,第一个重点是检测注册表内容是否符合规范.第二个重点是网页页面的一个图片的滚动,第三个重点是学习如何让网页定时跳出广告.
以下是自己对今天的三个重点的一些理解:
第一个重点比较容易理解,使用事件onsubmit(因为这个事件比较特殊,需要return),然后让每个表单元素加上id,使用<script>里的function获取到元素内容id,定义一个变量名接收这些元素内容,然后进行一些判断,比如输入用户名就可以判断是不是空的,如果是的话就使用alert()让网页弹出警告,,并且return flase,让表单里的内容数据不提交.
第二个重点是让网页里的图片进行滚动翻页,在这里需要用到和重点一一样的方法,不过稍有区别的是直接在图片上做判断,而且还用到了JS里的一个方法叫 setInterval()根据设定的毫秒值周期来调用函数或者计算表达式.然后获取到网页显示内容的效果.这个方法需要去掌握.
第三重点是让网页定时弹出广告图片又自动关闭,这个重点相对来说不好理解,首先你需要让被显示的图片先隐藏在网页里,然后根据setInterval()来给他设定显现的时间毫秒值,同时也要根据setInterval()来给他设定消失的时间,这里重点是一个图片的代码里和函数计算表达式需要设计它的样式让他消失和显示,同时调用setInterval()这个方法就会在一个周期内一直显示和消失就会出现闪屏的冲突,这里需要让消失里的方法结束clearInterval();才会解决这个问题.
作者: 郁闷客 时间: 2018-5-17 23:22
林树德
今天学习了JavaScript,js能够让我们页面能够动起来是一款脚本语言;起到更好的视觉效果;使用过程需要一个事件去触发,触发一个函数,定义一个函数,来获得对象的操作权,来修改要操作的对象的属性或者值,主要学习了BOM当中window对象中的一些常用方法,来操作一些函数,通过注册校验,图片轮播及插入广告案例,多少能够明白一些用法,不足的就是对对象当中的一些属性不太了解,案例敲起来很吃力.
作者: conan75 时间: 2018-5-17 23:24
陈昆明:
今天对js进行了初步的学习,作为又一种新的语言,我们得对它的语法进行初步的了解,其实js虽然和java没有半毛钱关系,但是它的基本语法和java有着相似之处,接触起来也会容易些,今天主要围绕课上的三个案例进行简单的总结:
针对第一个案例,我们需要利用函数来达到我们的要求,那么首先的问题就是在js中如何调用一个函数,不同于java,在js中想要调用一个函数就必须有一个事件的触发,这里我们可以借助window的事件来进行调用函数,这里有一个小tips就是只要是事件都是以on开头的,可以方便我们记忆,有了事件之后我们就可以编写我们的函数了,需要注意的是js编写函数的固定格式,这是需要我们进行记忆的,js的函数借助<script>标签统一写在head部分,在函数中,这里我们要完成的是进行简单的数据校验,那么在这里我们得要先获得相应文本框的使用权,这个其实和java是很相似的,你要对某个对象进行操作,是肯定要先获取到它后才能进行相关的操作的,然后我们可以通过对象调用它相应的属性进行相关判断从而达到我们的目的,这个案例的重点在于onsubmit这个事件调用函数是需要一个返回值的,所以创建事件的格式需要注意,而且在函数编写中也要注意需要有一个返回值.
轮播案例需要注意的点主要是图片src的控制,我们需要借助一个变量进行相关的拼接从而使图片产生轮播的效果;
定时广告的需要注意,我们通过document调用的setinterval等方法,它是有一个返回值的,这个返回值的作用可以理解成就是给每个setinterval方法进行标识,因为clearinterval在被调用的时候,你需要告诉它到底是要去清空哪一个interval,要不然方法是无法到达预期效果的
作者: 凉面要趁热吃 时间: 2018-5-17 23:27
黄进安:
1. js的使用步骤: 你要在什么时候做什么事情?做什么?------à操作的具体内容
对谁?---------à获取要操作的对象(document.getElementById(“id名”);)
把对谁做什么封装成一个函数(方法);
什么时候?---à触发你做这件事的事件(加载页面,单击鼠标……)
2. 学CSS的时候一直有个疑惑id选择器和类选择器到底有什么区别?好像可以都可以应用于任何元素,那么在使用上到底有什么区别之处?
今天教了js在获取要操作的对象都是采用document.getElementById(“id名”);来获取页面的元素,再对元素根据需求操作.
找了下度娘得到以下答案:
1) ID选择器只能在文档中使用一次。与类选择器不同,在一个HTML文档中,ID选择器只能使用一次,而且仅一次。而类选择器可以使用多次。
2) 可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式,但只可以用类选择器的方法实现,ID选择器是不可以的(不能使用 ID 词列表)。
作者: 郑学馨 时间: 2018-5-17 23:31
郑学馨:
Javascript:脚本,在html中的作用,通过javascript函数,对我们
输入的动作进行识别判断然后做出回应!
今天要实现的三个功能:图片轮播,广告弹出,表单校验,
1:图片轮播:主要用到js中的setinterval方法,通过
Window.onload来启动方法的入口,onload表示网页一打开就执行
的方法,通过调用function(函数)来设置图片轮播,实现的关键点
是通过将利用id查找到的元素对象的src地址值改变成下一张图
片的src地址;
2:广告弹出:运用onload,settimeout来设置延时,注意图片的隐
藏和显示要使用css中的diaplay(block:表示显示/none:表示隐
藏)
3:表单校验:获取表单上输入的值(.value),通过if语句判断是否
符合要求,return一个布尔值,
总结:第一格式很重要,多打代码少看视频,第二,关键词的理
解;windos/onload/funtion/settimeout/setinterval/document
/getelementbyid/alert/var/这些理解了,至少能完全看懂代码
了,第三:功能如何实现的,
作者: finfin12 时间: 2018-5-17 23:32
张育辉
js总结:
1:如果是html是骨架,css是衣服,那js就行为,
让页面更加丰富,更炫,能让整个页面动起来;(运行在游览器的一个脚本语言)
2:js三个部分组成ECMAScript,DOM,BOM,
今天学习了两个部分,ECMAScript和BOM,
2-1:ECMAScript是一种类似java格式的语法,但是和java没有半毛关系,
不同的是,java是强类型语言,定义变量,明确类型,
js,任何数据类型都用var来接收,还有一个全都 ===是类型和数值都相等才返回true;
2-2:BOM学习了Windows对象,由于是最顶层,Windows可以省略不写,常用的事件有
1:onclick:点击事件,绑定空按钮,点击一次执行一次函数.
补充:onsubmit 绑定提交按钮,但是需要返回值,不然话会提交数据,
2:onload:加载事件,等到页面加载完毕在执行onload事件所指向的函数,图片轮播
还可以匿名函数window.onload = function();类似于java静态方法,类一加载就加载;
3:setInterval("changeTime()",3000);定时器,参数1:需要执行的函数,参数2,间隔多少毫秒,可以一直执行
4:setTimeout("同上")只执行一次就没了
5:他们都需要获取相对性的id,方法document.getElementById("lunboimg");
6:confirm("你确定是否删除");//确认弹出框
7:prompt("请输入你要查找的内容");//输入框
8:location.href ="网站首页展示.html";//页面跳转,可以设置多少毫秒跳转一个新的页面
作者: 李成林 时间: 2018-5-17 23:34
李成林
js总结
关键字<script>(脚本);
window对象的常用方法
setInterval():设定间隔时间;
setTimeout():设定只执行一次
aler();弹出对话框
事件触发
onclick:点击触发
ondblclick:双击触发
mouse(鼠标)
onmouseover:鼠标悬浮触发
onmouseout:鼠标离开触发
onload:页面加载触发 一般定义在 dody(身体)中和window.onload;
document(文件)中的方法
getElementById():根据id获取地址值
element(元素)
一般在开发中的使用步骤:
确定触发事件;
根据触发事件来决定构造函数是否执行
根据id来获取要操作的对象
拿到对象进行修改;
作者: Ldddd 时间: 2018-5-17 23:45
赖镇东:
JavaScript
今天学习了JavaScipt的ECMAScript中的基础语法,与Java语法很相似,但有几点是与Java不一样的。1,变量是可变性;2,分号;可有可无3,数据类型的不同;4,有一个运算符===
主学习了BOM浏览器的对象Window方法,window中的方法主要是运用在网页界面上的操作。下面是我整理的Xmind:
作者: 黄兴磊 时间: 2018-5-17 23:46
这几天学习单词量有点多,英语渣渣的我学的有点吃力,明明知道原理是这样的,敲代码的时候无从下手,单词过一会就忘,忘了在回去也看不懂了,总结下,还是碰到新单词可以存下,把备注和单词的用途都写清楚一点,设定一个复习时间每天都复习一下
作者: ...ylq 时间: 2018-5-17 23:47
叶凌青
今天学了JavaScript
其实他就是一种运行在浏览器的脚本语言
他的作用是让网页动起来
JavaScript的基本语法
很多都和java类似
要注意的地方是
=== 全等于.全等于是类型和值都一致的情况下才为true.
==知识比较他们的值是否相等,相等就返回true
今天还学习了事件,通过事件调用函数.
通常开发步骤
1,JS通常都由一个事件触发
2, 触发一个函数,定义一个函数
3,获得操作对象的控制权
4,修改要操作的对象的属性或值
还学习了两种js的引入方式,
JS代码需要使用<script></script>
1,直接在页面中引入
2,定义一个js文件
在HTML中引入该JS代码即可 通过标签引入<script src = ""></script>
定义函数的两种格式
1.
function 函数名称(){
// 函数体
}
可以理解为java中的方法,调用才执行
2.window.onload = function(){
// 函数体
}
理解为java中的静态代码块
作者: AsusCoder 时间: 2018-5-17 23:48
本帖最后由 AsusCoder 于 2018-5-18 18:35 编辑
姓名:曾耀峰
这三天html+css+js,有点吃不消,量力而为地掌握,熟悉API文档上的方法。设想这些功能在以后开发中的使用场景,以后遇到Mark一个印象。
今天学了js,最大的感受是,在视觉上能够给页面有一些活力。比如给广告展示模块设置轮播;在功能上的使用是很强大的,比如:
1.能够获得任意一个标签,并能修改它。
2.多种事件触发捕获,能够添加更多的功能。比如,当点击表单form的submit按钮,会触发onsubmit事件。这个时候想捕获这个事件,就可以在form上面添加一个属性onsubmit ='js函数'。
总结今天的知识:
一.案例1:制作广告图轮播效果。
这个主要功能是使用window.setInterval("函数方法",毫秒数) 这个方法来设定该网页每个毫秒数执行所引用的函数方法。interval在英语的单词意思是间隔,时段等意思。理解方法的名称就可以知道这个函数的功能。
另外,调用该函数还需要用到window.onload这个事件,当网页body标签加载的时候就会触发该事件。
比较困难的是。函数内调用另外一个函数,还有第一次用js写逻辑时候,会有点手生。
贴一下代码方便记忆:
<script type="application/javascript">
window.onload = function() {
window.setInterval("changeImg()", 5000);
//window.setTimeout("popTopAd()", 3000);
};
var i = 1;
function changeImg() {
i++;
if(i > 3) {
i = 1;
}
var img1 = document.getElementById("img1");
img1.src = "img/" + i + ".jpg";
}
document是小写,不是大写的Document,写成大写会没有效果
getElementById("标签的id名字")是重要方法
做出来的轮播效果是瞬间切换图片的,和范例网页上的图片平移轮播不一样。在思考如何制作。
二、案例2:加载页面一次性弹出广告层效果
这个案例启动的事件同样是onload事件,由于onload事件只能声明一次。所以当广告图片切换和广告层弹出同时要使用onload事件的时候,只能把两个函数都放在window.onload = function(){}匿名函数体里面。一次性的延迟设置方法使用setTimeout("函数方法",毫秒数)。使用一次就不会再调用了。隐藏一个标签的属性是display:block;显示是display:none;通过getElementById()方法获取到广告层。直接设置ad.style.display 的值即可完成。
三、案例3:其他常用的js方法:
prompt()方法能够弹出一个可以输入数值的窗口。这个方法对于以后我们在后台管理页面进行数据的修改应该是比较常用的。输入新的数据,可以覆盖原来的数据
confirm()方法能弹出一个确认的窗口,对于以后删除数据等慎重的行为,加上这样一个窗口可以再确认一次,防止数据丢失。
另外,BOM的全拼是Browser Object Model 浏览器对象模型。是我们今天所学的知识。BOM除了Window这个顶级对象 ,其他另外六个对象。其中Screen屏幕,Timing.时间,Coookies本地缓存等三个对象是重要的,后面有空再学习。
今天写代码遇到的问题:
1.在补齐首页的热门商城模块中,单项商品的商品图片,名字,价格这三个,由图片,文字,链接等三个非块状标签组成,如何将它们进行规则排列。参考代码中的属性display:inline-block能将图片标签转换为块状元素,其他文字标签,链接标签各自贴上p标签,可以很好使用。
2.在补齐首页的人们商城模块中。因为总共要连续粘贴复制十次相同的商品展示项,导致代码冗余。利用js的innerHTML方法来动态HTML代码。只要写好一个,获取它,并循环十次就可以生成同样的代码。
3.当页面用百分比尺寸布局的时候,将浏览器窗口缩小的话,页面的布局会被打乱。这是一个不好的体验。后面查了资料。解决方法是给div设置最小宽度值min-width。设置的值为自己屏幕的大小。
使用属性min-width。设置为min-width:1360px;。当然,每一个div都这样设置最小宽度值是不行的。直接给套在最外层
的一个div设置一个即可。
视频上提供的WEB01项目并没有进行这样的设置。应该补上去的。
作者: 光宇 时间: 2018-5-17 23:51
侯玉林
今天我们学习了js.
所谓js就是一种用于浏览器的脚本语言.
能够在浏览器端进行一些简单的逻辑运算,避免代码来回在浏览器和服务器之间来回切换,大大提高了程序的响应效率.
js的运行机制主要是通过事件和函数来实现的,当某个事件发生,就运行一个或多个函数.
主要的实现有两种方式:
1.在标签中写下当发生a事件就调用b函数,然后在script中写下b函数的具体实现步骤.
1.匿名函数,直接在script中写下当发生某个事件就触发莫个函数.
作者: 磬辰 时间: 2018-5-17 23:54
本帖最后由 磬辰 于 2018-5-18 01:29 编辑
林文辉
如果把网页比作一个人,css比作外貌的话.那js就相当于给它附上了灵魂.作为一种基于对象的弱类型脚本语言,整体相对于java要更加的简洁和紧凑.而且相对于java也没有那么的严谨,所以刚上手的时候会比较不适应,但是有编程基础整体学起来就比较快点.
js的强大之处的之一就在于它只依赖与浏览器本身,只要浏览器能支持js,那么它就能发挥它的各种功能,非常的灵活.并且js还有对应的框架.比如jQuery.本着Write less,do more的核心概念,使我们操作起来更加的方便快捷.
今天学习到的知识虽然只是js的凤毛麟角,但就已经足够体现它的优势了.比如我们可以直接在客户端通过js进行一些表单或者其他的校验,不要去往返的客户端和服务器之间进行传输,光是这点就可以节省很多资源了.并且通过js我们可以进行各种各样的人性化设置,让用户的体验变的更好. 因为js一般不会报错,所以很有可能会造成你单词或属性名打错 或者打反造成你调试了半天也没发现错误在哪. 这个影响还是很大的,所以在写js时尽量慢点或者仔细点,避免出现这些低级而又 耗时的错误.而且最后是写一点调试一点,不建议写了一大堆再去调试, 而且因为js代码相对来说可能会凌乱点, 而且代码量再多的话 就更难发现错误,
调试可以用火狐或谷歌,也可以手动通过alert()来测试.浏览器就推荐这两个,其他的太坑了 尤其360,最好不要用.火狐和谷歌各有优点,谷歌的控制台是英文(按F12进入),j火狐有中文的,但是火狐偶尔也会有问题.比如某个功能要客户端跳转服务器,火狐可能就只给你抛回一个值,这样你可能不是很清楚到底有没出问题,但是谷歌就会直接给你报出错误在哪.所以这两个浏览器看个人喜好了.
最后一点,命名要规范.尤其是像id="" name=""这种,最好不要用关键字,比如你写个<input id="submit"> ,这样有可能就会出现 submit() is not a function.很麻烦.所以建议命名时以小驼峰式命名(第一个单词小写,后面的每个单词首字母大写),这样不管是自己还是别人看代码 一目了然
作者: 黄志彬 时间: 2018-5-18 00:00
弹出广告
先把图片设为none隐藏起来,然后设置显示定时
通过标签id获得标签对象: document.getElementById(" ")
block元素显示为块级元素,元素前后会带有换行符 清除定时
window调用设置隐藏定时,none隐藏起来 清除定时
让图片轮播
window对象加载function方法 :window调用设置定时 里面传入要执行的表达式和毫秒值;
获取图片控制权 , 获取元素id 把元素id里面的路径设为可变的i。
history对象方法;就是浏览的历史 go()方法可以前进后退或加载到某个具体页面。
location对象方法弹出confirm();弹出一个确认窗口。方法弹出prompt();弹出一个可输入的对话框方法弹出prompt();弹出 open(); 打开一个新窗口
今日单词
onclick 点击
onload 加载
setInterval 设置时间间隔
confirm 确认
prompt 输入
Location 地点
display 展示
block 阻塞
none 没有的
document 文档
Timeout 超时
alert 警告框
onfocus 聚焦
navigator 导航
priPage 前一个页面
nextPage 下一个页面
作者: 林荣彬 时间: 2018-5-18 00:02
林荣彬
JavaScript是运行在浏览器端的脚本语言,脚本可位于 HTML 的 <body> 或 <head> 部分中,或者同时存在于两个部分中。
JS的基本语法:
1.区分大小写:
2.弱变量类型语言:
3:分号可有可无
4:变量命名:第一个字符必须是字母,下划线,美元符号
JS中的运算符:用法与java一致.只有一种不一样:===(全等于运算符)既比较运算符的类型也比较值.不同于==,==只比较值是否相等
JS中的语句:用法与java一致
设置定时的两种方法:
(1)setInterval("javascript语句",毫秒) 设置定时后会每隔设定的毫秒值后无限的循环执行
(2)setTimeout("javascript语句",毫秒) 设置定时后只会执行一次
关闭定时的两种方法:
(1)clearInterval(setInterval_variable)
(2)clearTimeout(setTimeout_variable)
数据校验:
1.给对象设置一个ID
2.在form中定义事件有返回值的触发函数onsubmit
3.在<script>标签中定义function(){}函数
4.根据ID名获取对象 document.getElementById("id").value并用变量var接收
5.if判断对象并返回值.
图片轮播:
1.将需要轮播的图片设置一个id
2.在<script>标签中定义匿名函数window.onload = function(){函数体}
3.在函数体中设定轮播时间window.setInterval("javascript语句", 毫秒值);
4.定义一个变量,并循环判断变量的值.
5.用图片的id在document.getElementById("id")中获取对象并用变量接收
6.图片id.src="img/" + 变量值 + ".jpg";轮播图片
页面定时弹出广告:
1.给隐藏的广告对象设置一个ID
2.在<script>标签中定义匿名函数window.onload = function(){函数体}
3.在函数体中设定轮播时间window.setInterval("javascript语句", 毫秒值)并用time接收
4.用图片的id在document.getElementById("id")中获取对象并用变量接收
5.图片id.style.display="block",显示广告
6.清空定时 window.clearInterval(time);
作者: chenyelong 时间: 2018-5-18 00:21
陈叶隆
今天学习了JavaScript,跟以前所学的知识有相同部分,也有不同部分.
相同的是大部分数据类型和语法都跟java类似,比如数据类型也分字符串String,数字number之类的.for循环,if-else之类的语法差不多.window调用的方法比如setInterval(),alert,confirm类似于之前的类名点上静态方法直接调用,只不过这个”类名”window可以省略了.
不同的是开发步骤跟之前的知识不一样,JS的调用需要一个事件去触发,然后调用方法,然后需要获取某个对象的控制权,再对对象的属性进行修改.感觉绕了几个弯,比较麻烦,有时候想不到思路.
作者: 1748341437 时间: 2018-5-18 00:29
林玮
今天呢,轩哥教了全新的内容js.js呢与之前教的没有任何关联,所以说是全新的内容;
之前web这一块学了两大块内容,一个是构建页面的框架,还有一个是给这个框架美化,他们分别是:
table(表格框架)由于不灵活就被div(块框架)替代了,CSS就是美化页面了;
但是学了框架和美化,页面还是死的,达到不了我们的需求,所以今天就学了js;
js全名JavaScript,主要功能是让页面动起来,JavaScript是一个脚本语言,它包含了ECMAScript,BOM,DOM(重点).
JS的基本语法很大程度的跟java语言嵌合;
而又有几个地方不同:
JavaScript java
1. js是弱变量类型语言 1. 所有变量类型不同接收变量的基本数据类型也就不同
所有变量都是用把var来接收 比如int--整数类型 String--字符串类型...
2. js只有两种数据类型 2.java也有两种类型
一种原始类型,一种引用类型 一种是基本数据类型,还有一种是引用数据类型
(引用类型内容也是不一样的)
3. 还有一个就是运算符了
运算符js和java基本相同就一个==和===号不一样,==号是内容相同就返回true,
===号是内容和类型都一样才返回true;
还有就是ECMAScript,BOM和DOM,其中DOM还没讲.ECMAScript就是JavaScript的基础语法.
BOM有五个对象:
window对象(重点讲了window的六个经典方法,我就讲两个比较重要的)
setingterval("属性()",time)--定时执行一个任务无限循环
settimeout("属性()",time)--定时执行一个任务只执行一次
Navgator对象
Screen对象
Histion对象
Location对象(这些查API都可以查的到,想知道去API查)
js的使用:
(由于这边的单讲的话有点繁琐,我就直接用代码实现了...)
例(图片滚动代码):
script标签是编写js代码的必要标签
<script>
//静态代码块
window.onload = function(){
//定时滚动属性changeImg()
window.setInterval("changeImg()",5000);
}
var i = 1;
//定义属性changeImg()让三张图片顺序循环滚动
function changeImg(){
//alert("aaaa");
i++;
if(i > 3){
i = 1;
}
var img1 = document.getElementById("img1");
img1.src="../img/"+i+".jpg";
}
</script>
作者: doudou0606 时间: 2018-5-18 01:43
day03
施炎生
JavaScript是运行在浏览器端的脚本语言,需要重点掌握以下几点。
1.window对象常用方法:
setInterval()
setTimeout()
alert()
confirm()
prompt()弹出一个可输入的对话框
open()打开一个新窗口
2.JS的引入方式:
第一种:页面内直接编写JS代码,JS代码需要使用<script></script>
第二种:将JS的代码编写到一个.js的文件中,在HTML中引入该JS代码即可通过标签引入<script src = ""></script>
3.开发步骤:
JS通常都由一个事件触发;(常用事件:onclick单击, ondblclick双击, onmouseover鼠标放上,onmouseout鼠标移开,onload加载页面)
触发一个函数,定义一个函数;
获得操作对象的控制权;
修改要操作的对象的属性或值;
4.重点掌握以下三个案例:
案例一:注册页面的校验
案例二:图片滚动
案例三:广告的显示与隐藏
作者: 柯建程 时间: 2018-5-18 08:29
柯建程
javaScript 脚本语言
BOM浏览器模型
DOM文档模型
弱变量类型语言(与java不同)javaScript没有具体类型,赋值后才找到类型 变量只用var
js的通常开发步骤
js通常由一个事件触发 事件(onclick,onload onsubmit(需要写return))
触发一个函数,定义一个函数
获得操作对象的控制权
修改要操作的属性或值
定义函数
functiom 函数名称(){}
window.onload=function(){} 匿名函数 只能有一个匿名函数
js引入
两种方式
一种:页面直接编写<script></script>
一种:写入js文件夹中<script src=""></script>
完成图片滚动效果(window对象)
设置定时
setInterval()每隔多少豪秒换一次
setInterval("函数名",5000)
setTimeout() 隔多少毫米执行一次
setTimeout("函数名",5000)\
清除定时
clearinterval 取消setinterval()
cleartimeout取消settimeout()
显示和隐藏广告
需要用到setinterval或settimeout
clearinterval或cleartimeout
css显示和隐藏的属性
display
block 显示元素
none 隐藏元素
作者: cxming 时间: 2018-5-18 08:35
陈旭明
理解了class容器和id容器使用场景的区别,class选择器一般用于css和div里面,id选择器一般用于javascript里面。
Js定义方法的步骤:
1.先在要进行操作的对象里面设置id;
2.设置事件加载的对象名;
3.通过对象调用函数
4.函数体里面设置要进行的操作:先通过id获取要进行操作的对象,然后对该对象进行操作
常用事件:onclick,ondblclick,onmouseover,onmouseout,onload...
原始数据类型:
undefined:未定义类型
boolean:布尔类型
number:数字类型
string:字符或字符串.
null:空
引用数据类型:null
定义变量都用var
Windows对象的方法:
alert(); --弹出对话框
setInterval(); --设置时间间隔,循环进行
setTimeout(); --设置时间间隔,只执行一次
clearInterval(); --清除设置的时间间隔
clearTimeout(); --清除设置的时间间隔
confirm(); --弹出一个确认窗口
prompt(); --弹出一个可输入的对话框
open(); --打开一个新窗口
作者: doudou0606 时间: 2018-5-20 08:36
day04
施炎生
1.JS的输出:document.getElementById(“”).innerHTML=”HTML的代码”;(注意:innerHTML是属性后面不用加括号)
2.常用事件:
onfocus:获得焦点时触发该事件
onblur:失去焦点触发该事件
onsubmit:表单提交的时候触发 (onsubmit应该写在form里面)
onload : 页面加载事件
onclick: 点击事件
onchange : 下拉列表改变事件
ondblclick: 双击某个元素的事件
键盘事件:
onkeydown : 某个键盘的键被按下
onkeyup : 某个键盘的键被松开
onkeypress : 某个键盘的键被按下或按住
键盘事件:
onmousemove : 鼠标被移动
onmouseout ;鼠标从某元素移开
onmouseover : 鼠标被移到某元素之上
onmousedown : 某个鼠标按键被按下
onmouseup : 某个鼠标按键被松开
比如淘宝购物时把鼠标放到宝贝图上就会放大,移开就会缩小就是用到鼠标的onmouseover,onmouseout事件。
3.重点掌握以下四个案例:
案例一:使用JS完成表单提示和校验
提取id和content然后作为参数传给onfocus()方法,简化代码。
案例二:使用JS完成表格的隔行换色
a.获得表格的控制权
b.获得表格行数
c.遍历每行,
d.判断语句(判断奇数行,偶数行)
案例三:使用JS完成复选框的全选和全不选
a.获得全选框。
b.判断全选框是否选中,再获得下面的复选框,修改checke属性。
案例四:使用JS完成省市二级联动的效果
a.定义数组arr[i][j],录入各省各市
b.清空城市列表中的内容
c.for循环遍历所有市
d.嵌套for循环
e.使用document.creatElement和document.creatTextNode将第一个列表中所选省份对应的城市添加到第二个列表中。
作者: 丶犯二 时间: 2018-5-21 01:27
任佳锋(漏补)
js,一种网页脚本语言,学习之后可以让HTML页面动起来
它由DOM,BOM,ECMAScript构成
里面的变量都为弱变量类型,因此都用var来接受
它的数据类型有 undefined,number,boolean,string,null
当你为var赋值时,你赋的值是什么类型,那么var变量就是什么类型
四种时间设定方法:
setInterval();循环
setTImeout();只作用用一次
清楚:
clearInterval()
clearTimeout()
几种常见的触发事件:
onclick 点击事件
onsubmit 提交事件需要一个返回值,否则默认为ture提交
onload 页面加载事件 随着页面的加载而加载, 类似于静态修饰的方法,随着类的加载而加载
onfocus 获得焦点
onblur 失去焦点
欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) |
黑马程序员IT技术论坛 X3.2 |