【JS&JQ】JavaScript&jQuery常用的25个知识点

JavaScript学习笔记

1、Var：所有变量必须使用var进行定义

2、修改页面文本

Var elName = document.getElementById(‘name’);

elName.textContext = message;

3、修改网页类

Var elShip = document.getElementById(‘stock’);

elShip.className = shipping;

elShip.className = ‘cool’

4、创建数组字面量

Ar colors = new Array（‘white’， ‘black’， ‘custom’）；

Var el = document.getElementById(‘colors’);

el.innerHTML = colors.item(0)

5、Js函数

Function updataMessage（）{

      Var el = document.getElementById(‘message’);

      El.textContext = msg;

}

updataMessage();

6、表达式可以分为匿名表达式、函数表达式、立即调用表达式

7、字面量的构造对象

Var hotel = {

      Name：‘Park’，

      CheckAvailability：function（）{

            Return this.name;

      }

};

8、创建与访问对象的构造函数对象

Function Hotel(name, rooms, booked){

      This.name = name;

This.CheckAvailability = function(){

      Return this.name;

}

};

9、构造函数的创建对象

Var hotel = new Object（）；

Hotel.name = ‘Park’;

Hotel.CheckAvailability = function(){

      Return this.name

}

10、浏览器对象模型window对象

Window.location  当前页面的url

Window.alert()     创建含有消息的对话框

11、Data对象

Var today = new Date（）；

Var year = todey.toDateString()

12、Dom文档对象模型

Dom树是wed页面的模型，当浏览器加载一个web页面时，它会创建这个页面的模型，这个模型被称为dom树，保存在浏览器的内存中，主要由文档节点、元素节点、属性节点、文本节点四类节点组成。

13、访问元素

返回单一元素的方法

GetElemrntById（‘id‘）                                one

QuerySelector（‘css selector‘）                  li.hot

返回一个或多个元素的方法

GetElementByClassName（‘class’）            hot

GetElementsByTagName（‘tagName’）     li

QuerySelectorAll（‘css selector’）              li.hot

14、从NodeList中获取元素

Var elements = document.getElementsByClassName(‘hot’)

If(elements.length >= 1){

      Var firstItem = elements.item(0);

}

15、更新文本时尽量使用textContext而不是innerText，innerText存在版本支持问题，并且性能不如textContext

16、更新文本和标签

Var firstItem = document.getElementById(‘one’)

Ver itemContext = firstItem.innerHTML;

firstItem.innerHTML = ‘<a href=\”http://example.org\”>‘ + itemContext + ‘</a>’;

17、将元素添加到dom树

Var newE1 = document.createElement(‘li’);

Var newText = document.createTextNode(‘quinoa’);

newE1.appendChild(newText);

var position = document.getElementsByTagName(‘ul’)[0];

position.appendChild(newE1);

18、获取属性节点的值

Var firstItem = document.getElementById(‘one’);

Var attr = firstItem.getAttribute(‘class’);

19、时间如何触发JavaScript的代码

（1）选择元素（2）指定事件（3）调用代码

20、将事件绑定到元素的方法

1. HTML事件处理程序：不推荐使用，最好将html、js分离开来
2. 传统的DOM事件处理程序：适用于所有主流浏览器，但是只能在事件上附加函数
3. 第二级DOM监听器：允许一个事件出发多个方法

21、jQuery

jQuery通过CSS样式选择器找到一些元素，并在这些元素上使用jQuery提供的一些方法

22、$()

通常使用$()来代替jQuery()

23、$(document).ready(function()){

//Your seript goes here

};

==

$(function(){

//Your seript goes here

});

24、获取元素内容

Var $listText = $(‘ul’).text();

$(‘ul’).append($listText)

25、Ajax

一种无须刷新整个页面就能为页面的某一部分加载数据的技术，允许从服务器请求数据，并加载数据，服务器通常能返回HTML、XML、JSON，jQuery简化了创建Ajax请求和处理服务器返回数据的过程