JavaScript学习12.1

JavaScript弹窗
可以创建3种消息框：警告框、确认框、提示框，可以不带window对象直接使用相应的方法
警告框：保护用户可以得到某些信息，当出现警告框后需要用户点击确认按钮之后才能操作
window.alert(); //简写，alert('sometext')
确认框：通常验证是否接受用户操作
确认：返回True；取消：放回false
window.confirm(); //简写，confirm('sometext')
提示框：常用于提示用户在进入页面前输入某个值
当提示框出现时，用户需要某个值，然后点击确认或取消按钮才能继续操作
如果用户点击确认，那么返回值为输入的值；如果用户点击取消，那么返回值为null
function myConfirm() {
var text;
var x = confirm("Please try it")
if(x==true){
text = "you get it, it is true"
}else{
text = "you lost it, it is false"
}
document.getElementById("confirm").innerHTML= text;
}

JavaScript的计时事件：一个设定的时间间隔后来执行代码
使用JavaScript有能力在一定的时间间隔后来执行代码，而不是函数在调用后立即执行，称之为计时事件
两个主要方法：
1）setInterval():间隔指定的毫秒数不停地执行指定的代码
2）setTimeout():暂停指定的毫秒数后执行指定的代码
都是HTML DOM window对象的方法

setInterval：语法
setInterval('javascript function', millseconds)
每两秒钟弹出一个hello
setInterval(function(){alert("hello") }, 2000);
显示时钟：
function myTime() {
setInterval(function () {
Timer();
}, 1000);
}
function Timer() {
var t = new Date();
var text = t.toLocaleTimeString();
document.getElementById("setTime").innerHTML=text;
}

setTimeout方法，会返回某个值
setTimeout('JavaScript函数',毫秒数)
第一个参数：JavaScript语句的字符串，可以是‘alert’，也可以是函数的调用
第二个参数：从当前起多少时间后执行第一个参数
setTimeout(function () {
getClock();
}, 500);
自己调用自己执行某个函数

JavaScript cookies 用于web页面的用户信息
cookies是一些数据，存储在你电脑上的文本文件中
当web服务器向浏览器发送web页面时，在连接关闭后，服务器不会记录用户信息，cookies就是解决如何记录用户的问题
1）当用户访问web页面时，他的名字可以在cookies中
2）当用户下一次访问该页面时，可以在cookies中读取用户访问记录

cookies以名/值对形式存储，如：username=Jhon
当浏览器向服务器请求web页面时，属于该页面的cookies会加入到请求中，服务端通过这种方式获取用户的信息

创建cookies
document.cookie属性来创建、读取、删除cookies
以字符串的形式返回所有的cookies，形式如：cookie1=value;cookie2=value;cookie3=value

JavaScript库
JQuary,Prototype,MooTools
JQuary是最受欢迎的框架
如果在网页中使用JavaScript库，只需在<script>标签中引入该库即可
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>

如果要测试库，需要在网页中引用它，使用<scrip>标签，src属性的值为库的URL

主要JQuary函数是$()函数，如果像该函数传递DOM对象，它会返回JQuary对象，允许通过CSS选择器来选取函数

2017.12.1
<script>
function myJq() {
$("#useJQuary").attr("style","color:red").html("hello jquary, my name is dengyexun");
}
$(document).ready(myJq);
</script>

JQuary允许链接，链接是一种在同一对象上执行多个任务的便捷方法，链式语法

总结：
JavaScript的对象：
1）字符串对象：String
2）日期对象：Date
3）数组对象：Array
4）布尔对象：Boolean
5）算数对象：Math

JavaScript的浏览器对象：
1）Window对象
2）Navigator对象
3）Screen对象
4）History对象
5）Location对象

内置的JavaScript对象
1）Document对象
anchor集合返回了当前文档中所有超级链接的数组,形式：<a name="abc"></a>
document.anchor.length:返回文档中锚的个数
document.anchor[0].innerHTML,第一个链接
var y = document.anchors[0].innerHTML;
document.getElementById("setDoc").innerHTML=y;

返回文档中表单的数目：
var y = document.forms.length;
document.getElementById("setDoc").innerHTML=y;

返回文档中第一个表单的名字：
var y = document.forms[0].name;
document.getElementById("setDoc").innerHTML=y;

返回文档中图片的数目：
var y = document.images.length;
document.getElementById("setDoc").innerHTML=y;

返回文档中第一个图像的id：
var y = document.images[0].id;
document.getElementById("setDoc").innerHTML=y;

返回文档的链接数目：
var y = document.links.length;
document.getElementById("setDoc").innerHTML=y;

返回文档的第一个链接的id
var y = document.links[0].id;
document.getElementById("setDoc").innerHTML=y;

返回文档中所有cookies的名/值对：
var y = document.cookie;
document.getElementById("setDoc").innerHTML=y;

返回加载的文档服务器域名：
var y = document.domain;
document.getElementById("setDoc").innerHTML=y;

返回文档的标题：
var y = document.title;
document.getElementById("setDoc").innerHTML=y;

返回文档的完整的URL
var y = document.URL;
document.getElementById("setDoc").innerHTML=y;

open() 方法可打开一个新文档，并擦除当前文档的内容。
打开输出流，向流中输入文本
var doc = document.open("text/html",'replace');
var text = "I am very happy!"
doc.write(text);
doc.close();
document.getElementById("setDoc").innerHTML="successful";

document.write()
document.writeln():换行输出
innerHTML:设置或返回表格行的开始和结束标签之间的HTMLL
document.getElementById('id1').innerHTML

用指定Name弹出元素的数目：
document.getElementByName('x).length
用指定的TagName弹出元素的数目：
document.getElementByName('input').length

2）Anchor对象
document.getElementById('id').charset:获得字符集类型
document.getElementById('id').href:获得链接的href属性
document.getElementById('id').hreflang:获得链接的hreflang属性
target属性描述了在何处打开链接
document.getElementById("baidu").target="_blank";
在一个新的未命名的窗口载入文档
document.getElementById('id').type:返回链接类型的type的返回值

3）Area对象
4）Base对象
5）Button对象
点击完成后，button不可用
document.getElementById("disbutton").disabled=true;
返回button所属表的id
document.getElementById("button1").form.id

6）Form对象
表单中所有元素的value值：
var myform = document.getElementById("form1");
var temp='';
for (var i=0; i<myform.length;i++){
temp += i+":"+myform.elements[i].value+"<br>"

} document.getElementById("setDoc").innerHTML=temp;

表单中action的属性值
document.getElementById('form').action

enctype 属性可设置或返回用于编码表单内容的 MIME 类型
如果表单没有 enctype 属性，那么当提交文本时的默认值是 "application/x-www-form-urlencoded"

返回表单元素的数量：
document.getElementById("f0rm1").length

返回发送表单数据的方法：
document.getElementById("form1").method
返回表单名
document.getElementById("form1").name

7）Frame对象
8）Image对象
9）Event对象
10）Option and Select对象
11）Table、TableHeader、TableRow、TableData对象