前端开发之框架篇(1)——JQuery的初步使用
在前端开发中使用框架,不止极大的减少代码量,而且将带来意外的惊喜。
这篇文章介绍的框架是JQuery,最值得说的是目前jQuery兼容于所有的主流浏览器, 包括Internet Explorer 6哦!!!
一、安装JQuery
方式1;从官网下载,附-:JQuery下载,下载后,用标签引用
方式2:在网页中直接引用,这里借用百度的CDN地址
二、基础语法
采用$(selector).action()的方式选取 HTML 元素,并对选取的元素执行某些操作。
这里的$就等于jQuery
console.log($===jQuery)//true 说明:这里是引入了jQuery了的
输出结果:
一般情况,为了防止网页在完全加载(就绪)之前运行 jQuery 代码,往往会采用以下方式:
$(function(){ // 从这里开始写 jQuery 代码... });
三、jQuery 选择器/$(selector)
常见的有以下几中使用:
1、元素选择器
效果如下:
点击按钮之前:
点击按钮之后:背景色发生改变。
2、#id选择器
将上面代码改成#id选择器,如下:
代码生成结果如第一种情况一样,说明修改成功。
3、.class选择器
将上面代码改成.class选择器,如下: