history 有关客户访问过的 URL 信息
location 有关当前的URL信息
location的属性:
属性 | 描述 |
---|---|
closed | 返回窗口是否已被关闭。 |
defaultStatus | 设置或返回窗口状态栏中的默认文本。 |
document | 对 Document 对象的只读引用。请参阅 Document 对象。 |
history | 对 History 对象的只读引用。请参数 History 对象。 |
innerheight | 返回窗口的文档显示区的高度。 |
innerwidth | 返回窗口的文档显示区的宽度。 |
length | 设置或返回窗口中的框架数量。 |
location | 用于窗口或框架的 Location 对象。请参阅 Location 对象。 |
name | 设置或返回窗口的名称。 |
Navigator | 对 Navigator 对象的只读引用。请参数 Navigator 对象。 |
opener | 返回对创建此窗口的窗口的引用。 |
outerheight | 返回窗口的外部高度。 |
outerwidth | 返回窗口的外部宽度。 |
pageXOffset | 设置或返回当前页面相对于窗口显示区左上角的 X 位置。 |
pageYOffset | 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。 |
parent | 返回父窗口。 |
Screen | 对 Screen 对象的只读引用。请参数 Screen 对象。 |
self | 返回对当前窗口的引用。等价于 Window 属性。 |
status | 设置窗口状态栏的文本。 |
top | 返回最顶层的先辈窗口。 |
window | window 属性等价于 self 属性,它包含了对窗口自身的引用。 |
|
只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop,而 Firefox 和 Safari 支持 screenX 和 screenY。 |
location的方法:
alert() | 显示带有一段消息和一个确认按钮的警告框。 |
blur() | 把键盘焦点从顶层窗口移开。 |
clearInterval() | 取消由 setInterval() 设置的 timeout。 |
clearTimeout() | 取消由 setTimeout() 方法设置的 timeout。 |
close() | 关闭浏览器窗口。 |
confirm() | 显示带有一段消息以及确认按钮和取消按钮的对话框。 |
createPopup() | 创建一个 pop-up 窗口。 |
focus() | 把键盘焦点给予一个窗口。 |
moveBy() | 可相对窗口的当前坐标把它移动指定的像素。 |
moveTo() | 把窗口的左上角移动到一个指定的坐标。 |
open() | 打开一个新的浏览器窗口或查找一个已命名的窗口。 |
print() | 打印当前窗口的内容。 |
prompt() | 显示可提示用户输入的对话框。 |
resizeBy() | 按照指定的像素调整窗口的大小。 |
resizeTo() | 把窗口的大小调整到指定的宽度和高度。 |
scrollBy() | 按照指定的像素值来滚动内容。 |
scrollTo() | 把内容滚动到指定的坐标。 |
setInterval() | 按照指定的周期(以毫秒计)来调用函数或计算表达式。 |
setTimeout() | 在指定的毫秒数后调用函数或计算表达式。 |
其中要详细讲解方法:
prompt()和confirm()和alert()
这三种方法,很像都是跳出一个对话框来与客户交流提示,不过之间的差别也很大
alert()方法:只弹出一个警示框,不能输入,只能做提示的作用
prompt()方法:调用时需要给两个参数,第一个为弹出对话框的提示内容,第二个为输入框的默认内容,我们可以用一个空的双引号来代替,就会显示没有默认值的输入框,让用户输入,输入的语句或内容,将以string的形式返回给我们
comfirm()给一个确认和取消的内容提示框,如我们删除内容时,会弹出一个是否删除的提示框,有两种选择,是和否,假如我们选择是,将返回一个true值,选否的话就会返回一个false值,参数只用给提示的信息
confirm("'是'还是'否'")
有关open方法的使用:
标准的open方法:
window.open(想要跳转到的页面的URL , 给新打开的窗口对象命名 ,有关新窗口对象的features(特征),是否添加到新的浏览记录(false)或者替换这条浏览信息记录(true))
一共4个参数,第三个features如不赋值,那么就会按照标准窗口打开
features有很多的值,具体可以参w3c schoolde http://www.w3school.com.cn/jsref/met_win_open.asp 去查看,这里列举4个常用的值:top left width height 这四个定义了窗口的大小和距离xy轴的位置
有关document的各种属性
集合 | 描述 |
---|---|
all[] | 提供对文档中所有 HTML 元素的访问。 |
anchors[] | 返回对文档中所有 Anchor 对象的引用。 |
applets | 返回对文档中所有 Applet 对象的引用。 |
forms[] | 返回对文档中所有 Form 对象引用。 |
images[] | 返回对文档中所有 Image 对象引用。 |
links[] | 返回对文档中所有 Area 和 Link 对象引用。 |
属性 | 描述 |
---|---|
body | 提供对 元素的直接访问。对于定义了框架集的文档,该属性引用最外层的 |
cookie | 设置或返回与当前文档有关的所有 cookie。 |
domain | 返回当前文档的域名。 |
lastModified | 返回文档被最后修改的日期和时间。 |
referrer | 返回载入当前文档的文档的 URL。 |
title | 返回当前文档的标题。 |
URL | 返回当前文档的 URL。 |
方法 | 描述 |
---|---|
close() | 关闭用 document.open() 方法打开的输出流,并显示选定的数据。 |
getElementById() | 返回对拥有指定 id 的第一个对象的引用。 |
getElementsByName() | 返回带有指定名称的对象集合。 |
getElementsByTagName() | 返回带有指定标签名的对象集合。 |
open() | 打开一个流,以收集来自任何 document.write() 或 document.writeln() 方法的输出。 |
write() | 向文档写 HTML 表达式 或 JavaScript 代码。 |
writeln() | 等同于 write() 方法,不同的是在每个表达式之后写一个换行符。 |
今天有关document学习了几个方法和属性
document.getElemetnById();
可以根据元素的ID获取到该元素的对象,元素对象的value和innerHTML等两个属性有所不同
value是写在元素标签中的内容
而innerHTML的内容是包含在标签中间的文本信息,
document.getElementsByname()
看到中间的s了没有?这代表的是返回的不是一个对象,而是一个对象的集合,所有的同名的元素都将被返回到一个集合中,可以通过下标获取到具体的对象,并对其进行改
document.getElementsByTagname()
这个方法会把所有同类型的元素返回到一个集合数组中,也是通过下标可以获取到并加以修改
document.referer
可返回载入当前文档的文档的 URL,假如有一个网页通过链接来到兑奖页面,兑奖页面使用document.referer()方法返回该访问文件的网页URL假如跟中奖页面的不一样,就说明有人直接复制粘贴过来的,那么就不符合打开网页的要求,
同时document可以认为是在HTML之外的一个标签,他包含了HTML,同时它也是窗口属性
Document 对象是 Window 对象的一部分,可通过 window.document 属性对其进行访问。
date时间属性的使用
如何制作一个动态的时钟
首先,获取现在的时间属性,var date= new Date()
然后通过获得的当前时间的对象date,可以获取具体的YYYY MM dd hh mm ss等方法
方法 | 描述 |
---|---|
getDate() | 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 |
getDay() | 从 Date 对象返回一周中的某一天 (0 ~ 6)。 |
getFullYear() | 从 Date 对象以四位数字返回年份。 |
getHours() | 返回 Date 对象的小时 (0 ~ 23)。 |
getMilliseconds() | 返回 Date 对象的毫秒(0 ~ 999)。 |
getMinutes() | 返回 Date 对象的分钟 (0 ~ 59)。 |
getMonth() | 从 Date 对象返回月份 (0 ~ 11)。 |
getSeconds() | 返回 Date 对象的秒数 (0 ~ 59)。 |
getTime() | 返回 1970 年 1 月 1 日至今的毫秒数。 |
getTimezoneOffset() | 返回本地时间与格林威治标准时间 (GMT) 的分钟差。 |
getUTCDate() | 根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。 |
getUTCDay() | 根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。 |
getUTCFullYear() | 根据世界时从 Date 对象返回四位数的年份。 |
getUTCHours() | 根据世界时返回 Date 对象的小时 (0 ~ 23)。 |
getUTCMilliseconds() | 根据世界时返回 Date 对象的毫秒(0 ~ 999)。 |
getUTCMinutes() | 根据世界时返回 Date 对象的分钟 (0 ~ 59)。 |
getUTCMonth() | 根据世界时从 Date 对象返回月份 (0 ~ 11)。 |
getUTCSeconds() | 根据世界时返回 Date 对象的秒钟 (0 ~ 59)。 |
getYear() | 已废弃。 请使用 getFullYear() 方法代替。 |
parse() | 返回1970年1月1日午夜到指定日期(字符串)的毫秒数。 |
setDate() | 设置 Date 对象中月的某一天 (1 ~ 31)。 |
setFullYear() | 设置 Date 对象中的年份(四位数字)。 |
setHours() | 设置 Date 对象中的小时 (0 ~ 23)。 |
setMilliseconds() | 设置 Date 对象中的毫秒 (0 ~ 999)。 |
setMinutes() | 设置 Date 对象中的分钟 (0 ~ 59)。 |
setMonth() | 设置 Date 对象中月份 (0 ~ 11)。 |
setSeconds() | 设置 Date 对象中的秒钟 (0 ~ 59)。 |
setTime() | setTime() 方法以毫秒设置 Date 对象。 |
setUTCDate() | 根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。 |
setUTCFullYear() | 根据世界时设置 Date 对象中的年份(四位数字)。 |
setUTCHours() | 根据世界时设置 Date 对象中的小时 (0 ~ 23)。 |
setUTCMilliseconds() | 根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。 |
setUTCMinutes() | 根据世界时设置 Date 对象中的分钟 (0 ~ 59)。 |
setUTCMonth() | 根据世界时设置 Date 对象中的月份 (0 ~ 11)。 |
setUTCSeconds() | setUTCSeconds() 方法用于根据世界时 (UTC) 设置指定时间的秒字段。 |
setYear() | 已废弃。请使用 setFullYear() 方法代替。 |
toDateString() | 把 Date 对象的日期部分转换为字符串。 |
toGMTString() | 已废弃。请使用 toUTCString() 方法代替。 |
toISOString() | 使用 ISO 标准返回字符串的日期格式。 |
toJSON() | 以 JSON 数据格式返回日期字符串。 |
toLocaleDateString() | 根据本地时间格式,把 Date 对象的日期部分转换为字符串。 |
toLocaleTimeString() | 根据本地时间格式,把 Date 对象的时间部分转换为字符串。 |
toLocaleString() | 据本地时间格式,把 Date 对象转换为字符串。 |
toString() | 把 Date 对象转换为字符串。 |
toTimeString() | 把 Date 对象的时间部分转换为字符串。 |
toUTCString() | 根据世界时,把 Date 对象转换为字符串。 |
UTC() | 根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。 |
valueOf() | 返回 Date 对象的原始值。 |
代码示例:
document.referer
--------------------------------------------------------------------------------
用户名
密码
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
经典案例:当当购书案例
在调用同一个加减方法是,如何对通过名字相同的数组中的元素进行修改,关键就在与开始的时候通过,调用时传入的参数
<div class="content"> <div class="logo"> <img src="dd_logo.jpg"><span οnclick="close_plan();">关闭span> div> <div class="cartList"> <ul> <li>¥<input type="text" name="price" value="21.90">li> <li><input type="button" name="minus" value="-" οnclick="jian(0);"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+" οnclick="jia(0);">li> <li id="price0">¥21.90li> <li><p οnclick="collection();">移入收藏p><p οnclick="del();">删除p>li> ul> <ul> <li>¥<input type="text" name="price" value="24.00">li> <li><input type="button" name="minus" value="-" οnclick="jian(1);"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+" οnclick="jia(1);">li> <li id="price1">¥24.00li> <li><p οnclick="collection();">移入收藏p><p οnclick="del();">删除p>li> ul> <ol> <li id="totalPrice"> li> <li><span οnclick="accounts();">结 算span>li> ol> div> div> <script> var list = document.getElementsByName("amount") var price = document.getElementsByName("price") function jia(num){ var num1 =parseInt(num) var num2 = 0; if(parseInt(list[num1].value)<10){ if(num1==0){ num2 = parseInt(list[num1].value) num2++; list[num1].value=num2; document.getElementById("price0").innerHTML="¥"+parseInt(price[num1].value)*num2 }else if(num1==1){ num2 = parseInt(list[num1].value) num2++; list[num1].value=num2; document.getElementById("price1").innerHTML="¥"+parseInt(price[num1].value)*num2 } } } function jian(num) { var num1 = parseInt(num) var num2 = 0; if(parseInt(list[num1].value)>1){ if (num1 == 0) { num2 = parseInt(list[num1].value) num2--; list[num1].value = num2; document.getElementById("price0").innerHTML="¥"+parseFloat(price[num1].value)*num2 }else if(num1==1){ num2 = parseInt(list[num1].value) num2--; list[num1].value = num2; document.getElementById("price1").innerHTML="¥"+parseFloat(price[num1].value)*num2 } } }