JavaScript学习笔记

   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有内建对象 ArrayBooleanStringDateNumberMathRegExp ,等,也可以自定义对象
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>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值