JavaScript学习笔记

最新推荐文章于 2025-05-28 08:00:00 发布

原创最新推荐文章于 2025-05-28 08:00:00 发布 · 294 阅读

0 ·

CC 4.0 BY-SA版权

javascript 专栏收录该内容

1 篇文章

订阅专栏

1. JavaScript 是一种用执行于网页活动的脚本语言，可以理解为交互，如当用户点击按钮时的操作，其代码是在html文档中一起的。

2. 与java很相似，但是不同类型的语言。

3. 与java的一些异同：

java通过<applet>来嵌入；js通过<script>来嵌入。
js 用 \ 算值，不会只保留整数
js 通过 function 定义函数，不用写返回值类型
都有三目运算符（）？（）：（）
js 有for(x in xxx){...} 用于遍历
字符串和值可以比较大小 ==比值，===比值和类型，如：x=5,y="5" 则x==y为true，而x===y为false

4. js可用于表单验证，在提交数据前看用户是否填完所有必填项目。

5. 在DOM(文档对象模型)中查找元素的方法

document.getElementById
document.getElementsByTagName
document.getElementsByName

6. js不仅可以修改html元素属性，也可以增加和删除：

增加和删除都需要知道父元素

<!DOCTYPE html>
<html>
<body>
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<script>
var para=document.createElement("p"); //<p></p>
var node=document.createTextNode("这是新段落。");//如需向 <p> 元素添加文本，您必须首先创建文本节点
para.appendChild(node);                //<p>这是新段落。</p>
var element=document.getElementById("div1"); //相当于将新结点加入到div最后
element.appendChild(para);
</script>
</body>
</html>

删除时可也以这样，就不用再找父节点了

child.parentNode.removeChild(child);

7. js有内建对象 Array ， Boolean ， String ， Date ， Number ， Math ， RegExp ，等，也可以自定义对象

person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";

等价于：

person={firstname:"Bill",lastname:"gates",age:56,eyecolor:"blue"}

也等价于：对象构造器，一次定义可以多次使用，里面也可以放方法

function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
myFather=new person("Bill","Gates",56,"blue");

注：属性可以用for in 来遍历

8. js有三种消息框

alert("警告框");//点击确定按钮才能继续进行操作
confirm("确认框");//如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false
prompt("提示框");//如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。

9. js的计时操作

var t=setTimeout("javascript语句",毫秒);
clearTimeout(t);

10. 浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”，以下均为对象：

window

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var w=window.innerWidth
var h=window.innerHeight
x=document.getElementById("demo");
x.innerHTML="浏览器的内部窗口宽度：" + w + "，高度：" + h + "。"
window.open("http://www.baidu.com")//打开新窗口
</script>
</body>
</html>

window.location 对象

获得当前页面url

window.history

获得浏览历史，back(),forword()方法相当于点击后退和前进

window.navigator

访问者浏览器的信息

11. cookie是什么？

简单来说，cookie就是用户在某一个网站上的唯一标识，服务器和本地浏览器存了这个标识，当用户访问网站时，浏览器也会发送那个网站的cookie给服务器，服务器根据cookie来看用户的状态。

<html>
<head>
<script type="text/javascript">
function getCookie(c_name) //获得cookie中key为c_name的value
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1)
    { 
    c_start=c_start + c_name.length+1 
    c_end=document.cookie.indexOf(";",c_start)//从c_start开始找“；”的索引
    if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
    } //unescape()如将%20解码为空格
  }
return ""
}
function setCookie(c_name,value,expiredays)
{
var exdate=new Date() //获得现在的时间
exdate.setDate(exdate.getDate()+expiredays)//获得有效期的最后一天日期
document.cookie=c_name+ "=" +escape(value)+ // escape() 不会对 ASCII 字母和数字进行编码，但会对空格等变编码
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())//根据世界时，把 Date 对象转换为字符串
}

function checkCookie()
{
username=getCookie('username')//获得该网站的cookie
if (username!=null && username!="")
  {alert('Welcome again '+username+'!')}
else 
  {
  username=prompt('Please enter your name:',"")
  if (username!=null && username!="")
    {
	//没有该网页的cookie，则模拟服务器给用户创建一个只含用户名的cookie,有效期365天
 setCookie('username',username,365) } }}</script></head><body onLoad="checkCookie()">
</body>
</html>