JavaScript 笔记本

HTML CSS JS 介绍

• HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。
• CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。
• JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

基本api

• document.write() 可用于直接向 HTML 输出流写内容。简单的说就是直接在网页中输出内容。
• alert(str) 弹出提示框
• confirm(str) 弹出确认框
• prompt(str1,str2) 弹出对话框
• window.open([URL], [窗口名称], [参数字符串])
• window.close(); //关闭本窗口

DOM

• DOM 将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。

  • 元素节点: html、body、p等都是元素节点，即标签
  • 文本节点: 向用户展示的内容
  • 属性节点: 元素属性

• 常用api

  • document.getElementById(“id”) 获取标签
  • innerHTML 属性用于获取或替换 HTML 元素的内容。

  • Object.style.property=new style; 改变 HTML 元素的样式

       var mychar = document.getElementById("mId");
       mychar.style.color="red";
    

  • Object.style.display = value 元素显示或隐藏

    mychar.style.display="none";
    mychar.style.display="block";
    

  • object.className = classname 属性设置或返回元素的class 属性

触发事件

• onclick ；
• onmouseover；onmouseout;
• onchange;
• onselect;
• onfocus; onblur;
• onload;onunload

内置对象

• Date();
• String 字符串对象
  
  • length
  • charAt(index)
• Math对象
• Array 数组对象

浏览器对象

• window对象指当前的浏览器窗口。

  • setInterval(代码,交互时间);
  • setTimeout(代码,延迟时间);计时器

• history对象

  • 记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。

• Location对象

  • location用于获取或设置窗体的URL，并且可以用于解析URL。
    

• Navigator 对象

  • 包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。
    

• screen对象用于获取用户的屏幕信息。
  

• DOM 对象

  • document.getElementsByName(name)
    
    • 返回带有指定名称的节点对象的集合。
  • document.getElementsByTagName(Tagname)
    
    • 返回带有指定标签名的节点对象的集合。返回元素的顺序是它们在文档中的顺序。

  • elementNode.getAttribute(name) /setAttribute()方法

    • 通过元素节点的属性名称获取属性的值。/设置值

  • 节点属性：每个节点都有三个重要的属性
    

  • 遍历节点
    

  • DOM操作: