JavaScript&jQuery

一.通过设置<script>标签的src属性值，我们可以链接一个.js(JavaScript)文件到HTML文档，如：

<script src='js/main.js'></script>

二.与DOM（文档对象模型）交互

可以通过HTML文档标签的class属性值找到这个标签，(调用getElementsByClassName方法)如：

var header = document.getElementsByClassName('example-class-name');<div class='example-class-name'> ... </div>

三.使用jQuery库中的函数

链接到jQuery库，使用<script>标签，其src值指向库的位置，如：

<script src='https://code.jquery.com/jquery-3.1.0.min.js'></script>

注：该语句需放在链接.js文件语句的上方，以赋予.js文件访问库的权利。

四.待HTML文档加载完，执行JavaScript函数

$(document).ready(main);

这句话表示当文档加载完毕后，会调用main函数。

五.使用jQuery找到带特定class属性值的HTML标签，如：

$('.skillset');

该语句效果类似于：document.getElementsByClassName('skillset');

注：jQuery字符串值为CSS的相应的selector值。

六.加载文档时产生淡入的效果
（1）调用hide（）方法隐藏某个标签，如：

$('.my-selector').hide();

该方法内部实现设置该标签的display属性值为none,这会隐藏该标签。
（2）调用fadeIn()方法，并赋予一个实参，其值为以毫秒为单位的时间值。如：

$('.example-class').fadeIn(400);

七.给标签添加点击监听事件
该标签设置一个监听器，通过调用on('click')函数，还可以指定点击事件发生后要执行的函数，如：

$('.example-class').on('click', function() {  // execute the code here when .example-class is clicked.});

八.让标签显示，调用show()函数,如：

$('.example-class').show();

九.让标签转换状态（显示或隐藏），调用toggle()函数，如：

$('example-class').toggle();

十.改变被点击标签的背景色等，调用toggleClass()方法，如：

$('.example-class').toggleClass('active')

这个方法会将实参具有该class属性值的标签交替应用到jQuery所指向的标签上。

注意圆点符号。

十一.关键字this代表当前标签对象。

十二.引用当前标签的下一个标签，调用next()方法，如：

$('.item-one').next().hide();

会将class属性值为"item-one"的标签的下一个标签隐藏。

十三.改变标签的文本内容，调用text（）方法，如：

$('.my-selector').text('Hello world!');

十四.给标签设置滑动的显示，隐藏动画效果，调用slideToggle()方法，该方法接收毫秒值作为实参，如：

$('.example-class').slideToggle(400);

15.鼠标停留事件监听，调用mouseenter()方法，如：

$(document).ready(function() {    $('div').mouseenter(function() {        $('div').hide();    });});

鼠标离开事件监听，调用mouseleave()方法。

16.fadeTo()方法接收两个参数，一个字符串类型表示淡化的速度，一个数字表明最终的透明度，如：

fadeTo('fast', 0.25);

表示快速淡化到原来透明度的25%。