当前位置: 代码迷 >> Web前端 >> 1、初识jquery
  详细解决方案

1、初识jquery

热度:104   发布时间:2012-10-27 10:42:25.0
一、初识jquery

1、window.onload() 与 $(document).ready(); 的区别
window.onload() 必须等待网页中所有内容加载完毕后才执行(包括图片),一个页面最多只能包含一个。
$(document).ready() 网页中所有dom结构绘制完毕后就执行,可能dom元素关联的东西并没有加载完,一个页面可以多次使用。
$(document).ready(function() {}) 还可以简写为 $(function() {});

2、jquery代码连用
$("#menu div").click(function() {
??? $(this).addClass("highlight").children("a").show().end().siblings().removeClass("highlight").children("a").hide();
});
说明:end() 重新定位到上次操作的元素

3、相互转换
1) jquery -> dom
$('#menu').get(0).innerHTML
$('#menu')[0].innerHTML

2) dom -> jquery
var dom = document.getElementById("menu");
dom.innerHTML;? // dom操作
$(dom).html()?? // jquery操作

4、jquery操作与dom操作对比
var $cr = $("#cr");
var cr = $cr.get(0);
cr.checked????????? // dom属性,判断dom是否被选中
$cr.is(":checked")? // jquery方法,判断对象是否被选中,返回boolean值

5、jquery与其他库冲突的问题
1)jquery在其他库之后导入
jQuery.noConflict(); // 将$控制权交给其他库,后续只能使用jQuery代替$
var $j = jQuery.noConflict(); // 自定义快捷方式,用$j来代替$,以便释放$的控制权
如果不想给jquery自定义名次,还要使用$而不管其他库,同时还不想与其他库冲突,可以使用如下两种方法:
??? (1)? jQuery.noConflict();
??????? jQuery(function($) {
??????????? var $cr = $("#cr");
??????????? // to do ...
??????? });
??? (2)? jQuery.noConflict();
??????? (function($) {
??????????? $(function() {
??????????????? var $cr = $("#cr");
??????????????? // to do ...
??????????? });
??????? })(jQuery);

2)jquery在其他库之前导入:直接使用jQuery

6、开发工具、插件
可以给Dreamweaver安装jQuery插件jQuery_API.mxp
也可以使用IDEA作为开发工具,它的功能很强大

  相关解决方案