首页 > 代码库 > Jq基础简介
Jq基础简介
jQuery就是用原生js写出的框架集(Write less do more )
1.需要注意的问题?
(1).jQuery语法需要重新学习
(2).jQuery需要注意版本之间的兼容性
(3)不是越新的版本越好(要稳定)
(4)jQuery一般有两个版本(xxx.min.js和xxx.js) 区别就是去除回车空格换行 (min版一般用在上线项目节约带宽)
2.jQuery的引入方式?
<script src=http://www.mamicode.com/”xxx.js”></script>
3.查看jQuery是否被正确引入
1.alert(jQuery);
2.alert($);
3.alert(window.$);
注:$代表jQuery
4.文档预加载
(1).
$(document).ready(function(){
});
(2).
$(function(){
});
注:正常情况下 jQuery的代码都要写在入口之内
能用jQuery语法完成的 尽量使用jQuery语法完成
5.jQuery多个样式设定
例:$(‘#one‘).css({color:‘red‘,backgroundColor:‘#fc1‘,fontSize:40});
注:原生CSS样式中有 ‘-‘ 的去掉并且将后面的单词第一个字母大写
6.jQuery节点短对象和原生js对象不能混用语法
(原生js节点对象与jQuery节点对象的相互转换)
var one = document.getElementById(‘one‘);
将js原生对象转成jquery对象只需要使用$( )包含起来
定义jQuery对象(变量名以$开头)
var $one = $(one);
将jQuery对象转换为原生DOM节点对象
var one = $(‘#one‘)[0];
第二种实现方法
var one = $(‘#one‘).get(0);
7.书写时注意一些规范格式
(注意换行,看起来更清晰易懂)
$(‘ul li‘)
.css(‘color‘,‘red‘)
.css(‘background‘,‘#fc1‘)
.css(‘marginTop‘,‘20px‘)
.click(function( ){
alert($(this).html( ));
});
8.回到最后一个破坏性操作之前 end( )
$(‘ul li‘).first( ).css(‘backgroundColor‘,‘#0fa‘).end( ).last( ).css(‘backgroundColor‘,‘#0f0‘);
Jq基础简介