论坛首页 Web前端技术论坛

Jquery 框架

浏览 6029 次
锁定老帖子 主题:Jquery 框架
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (1)
作者 正文
   发表时间:2008-01-16  

 

 

*************************************************************************

觉得Jquery作为js框架用起来很方便,与大家分享一下

*************************************************************************

1、jquery对象与普通js对象

      jquery对象就好像是包裹着一层特殊外壳的js对象,他享有独特的jquery方法--通常都很实用。

2、取得jquery对象的方法

      介绍一个最通用的吧:

      $("tagName[@attr=value]");        例如:$("input[@type=checkbox]")

      方便之处在于attr可以自己随便定义,比如:选取元素<div attribute_test="xyz">test</div>,就可以这样写:$("div[@attribute_test=xyz]")

      还有一些常用的简写:

      $("tagName")--取对应tagName的元素;

      $("#id")--取对应id的元素;

      $("parent_tagName>child_tagName")--取属于parent_tagName的child_tagName元素;

3、取得jquery元素之后有什么用

      取得jquery元素之就和取得js元素一样,不过要进行的动作就被简化了,因为有强大的jquery的方法的支持,很多常用的js操作都变得异常轻松。
这个就不详细介绍了,附 中文使用手册 一本,非常使用,再推荐几个基于jquery框架的实用js实例以及常用的js函数:

jquery.js   (源文件,放到你可以引用的地方)

jquery 手册 ----有了这个 jquery 使用起来就得心应手了。

pageValidator.js (jquery 表单验证--支持ajax验证)

                           ----不会用的话可以和我商议,或者自己找网上教程:http://www.aspstat.com/38

cookie.js (js设置cookie以及获取js函数)----感谢哪位网友写的,不知出处了,转载而已。

------------------------------------------------------------------------------------------

function GetCookieVal(offset)
//get Cookie value after decoding
{
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
function SetCookie(name, value)
//set Cookie value
{
var expdate = new Date();
var argv = SetCookie.arguments;
var argc = SetCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
if(expires!=null) expdate.setTime(expdate.getTime() + ( expires * 1000 ));
document.cookie = name + "=" + escape (value) +((expires == null) ? "" : ("; expires="+ expdate.toGMTString()))
+((path == null) ? "" : ("; path=" + path)) +((domain == null) ? "" : ("; domain=" + domain))
+((secure == true) ? "; secure" : "");
}

function DelCookie(name)
//delete Cookie
{
var exp = new Date();
exp.setTime (exp.getTime() - 1);
var cval = GetCookie (name);
document.cookie = name + "=" + cval + "; expires="+ exp.toGMTString();
}

function GetCookie(name)
//get Cookie original value
{
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen)
{
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return GetCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}

---------------------------------------------------------------------------

shade.js (js 遮罩效果--实现全屏变灰,凸显要显示的div)----sAlert(div)就可以遮罩显示你的突出div

---------------------------------------------------------------------------

function sAlert(frame){
var shield = document.createElement("DIV");
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = ((document.documentElement.clientWidth>document.documentElement.scrollWidth)?document.documentElement.clientWidth:document.documentElement.scrollWidth)+"px";
shield.style.height = ((document.documentElement.clientHeight>document.documentElement.scrollHeight)?document.documentElement.clientHeight:document.documentElement.scrollHeight)+"px";
shield.style.background = "#000";
shield.style.textAlign = "center";
shield.style.zIndex = "0";
shield.style.filter = "alpha(opacity=0)";
shield.style.opacity = 0;
document.getElementById(frame).style.cssText = "position:absolute;z-index:1;top:"+(+25+document.documentElement.scrollTop)+"px"+";left:30%;background-color: #FFFFFF;" ;
document.body.appendChild(shield);
this.setOpacity = function(obj,opacity){
   if(opacity>=1)opacity=opacity/100;
   try{
    obj.style.opacity=opacity;
   }catch(e){alert(opacity)}
   try{
    if(obj.filters.length>0&&obj.filters("alpha")){   
     obj.filters("alpha").opacity=opacity*100;
    }else{
     obj.style.filter="alpha(opacity=\""+(opacity*100)+"\")";
    }
   }catch(e){}
}
var c = 0;
this.doAlpha = function(){
   if (c > 40){clearInterval(ad);return 0;}
   c=c+5;
   setOpacity(shield,c);
}
var ad = setInterval("doAlpha()",1);
this.doClear = function(frame){
   document.getElementById(frame).style.display = "none";
   document.body.removeChild(shield);
   $("div[@class=log_result]").empty();
}
}

------------------------------------------------------------------------------

md5.js (md5 加密函数)

 

更多的jquery效果和新的版本请登陆jquery官方网站:

论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics