Release:jQuery 1.2

出自Guoshuang Wiki

Downloading

If you wish to checkout the full release from the Subversion repository, you can do so by following the following instructions and checking out the source from the following location:

 svn co http://jqueryjs.googlecode.com/svn/tags/1.2

Plugins:

New Features

Selectors
- :has(selector)
- :header
- :animated
- XPath Selector Plugin
Attributes
- .val() Overhaul
Traversing
- .map()
- .prevAll() / .nextAll()
- .slice()
- .hasClass()
- .andSelf()
- .contents()
Manipulation
- .wrapInner() / .wrapAll()
- .replaceWith() / .replaceAll()
- .clone(true) Event Cloning
CSS
- .offset()
- .height() / .width() for document and window

Ajax
- Partial .load()
- Cross-Domain getScript
- JSONP
- .serialize() Overhaul
- Disable Caching
Effects
- .stop()
- %/em Animations
- Color Animations
- Relative Animations
- Queue Control
- :animated
- step: Function
Events
- Namespaced Events
- .triggerHandler()
Internals
- Documentation Move
- Expando Management

How To Upgrade

First, if you have not done so already, please upgrade to jQuery 1.1.4. This should help to remove most of the surprises inbetween the last version of jQuery your code was using and the current release.
Go through the list of deprecated and removed features and make sure that you're not using any of them in your code.
- If any plugins that you're using still require some of the old functionality, you can feel free to include the jQuery 1.1 Compatibility Plugin or the XPath Compatibility Plugin, depending on the situation.
Introduce jQuery 1.2 into your site. If anything immediately breaks, please report it to the bug tracker so that we may investigate, and resolve, the issue. Otherwise, you should now be using jQuery 1.2 - enjoy!

New Plugins

jQuery 1.1 Compatibility Plugin

A few pieces of functionality were removed in the jQuery 1.2 release. Including this plugin allows you have all of the features that were removed in your copy of jQuery 1.2.

The plugin would typically be used like so:

 <html>
 <head>
   <script src="jquery-1.2.js"></script>
   <script src="jquery.compat-1.1.js"></script>
   <script>
     $(document).ready(function(){
       // Old jQuery 1.1 Functionality
     });
   </script>
 </head>
 <body>
   ...
 </body>
 </html>

XPath Compatibility Plugin

Since XPath selectors were removed from jQuery in 1.2, a new XPath Selector Plugin has been introduced. You can use this plugin to give yourself the CSS/XPath hybrid selectors that have existed in jQuery since its creation.

<html>

<a href="#code">Code</a>
<a href="#demo">Demo</a>
<a href="#source">View Source</a>
<a href="#results">Results</a>

</html> {{#if: <script src="http://dev.jquery.com/view/trunk/plugins/xpath/jquery.xpath.js"></script> <div><p>I'm a simple paragraph inside a div.</p></div> <p>I'm a paragraph outside of a div.</p> || <html>

</html>

An example of including and using the XPath selector plugin to find a child paragraph of a div and give it a border.

$("//div/p").css("border", "1px solid black");

<html>

</html>}}{{#if: <script src="http://dev.jquery.com/view/trunk/plugins/xpath/jquery.xpath.js"></script> <div><p>I'm a simple paragraph inside a div.</p></div> <p>I'm a paragraph outside of a div.</p> | <html><div id="demo" class="tabs-container" rel="</html>125<html>"></html>

An example of including and using the XPath selector plugin to find a child paragraph of a div and give it a border.

$("//div/p").css("border", "1px solid black");

<html>

</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  {{#if:  |{{{inhead}}}|}}
  <script>
  $(document).ready(function(){
    $("//div/p").css("border", "1px solid black");
  });
  </script>
  {{#if:  |<style>{{{css}}}</style>|}}
</head>
<body>
  <script src="http://dev.jquery.com/view/trunk/plugins/xpath/jquery.xpath.js"></script>
<div><p>I'm a simple paragraph inside a div.</p></div>
<p>I'm a paragraph outside of a div.</p>
</body>
</html>

<html>

</html>|}} {{#if: <script src="http://dev.jquery.com/view/trunk/plugins/xpath/jquery.xpath.js"></script> <div><p>I'm a simple paragraph inside a div.</p></div> <p>I'm a paragraph outside of a div.</p> || {{#if: |<html>

</html> {{{results}}}<html>

</html>|}}}}

Color Animation Plugin

A new, official, jQuery plugin that supports animating CSS colors of elements by using the new jQuery Animation API. Supported CSS properties include: 'backgroundColor', 'borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor', 'color', 'outlineColor'.

<html>

<a href="#code">Code</a>
<a href="#demo">Demo</a>
<a href="#source">View Source</a>

<a href="#results">Results</a>

</html> {{#if: <script src="http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js"></script> <button id="go">» Run</button> <div class="block"></div> || <html>

</html>

Flashes the div to alert the user. Change its background color to pink, and once it's done return to the original color.

$("#go").click(function(){
  $(".block").animate( { backgroundColor: 'pink' }, 1000)
    .animate( { backgroundColor: 'blue' }, 1000);
});

<html>

</html>}}{{#if: <script src="http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js"></script> <button id="go">» Run</button> <div class="block"></div> | <html><div id="demo" class="tabs-container" rel="</html>125<html>"></html>

Flashes the div to alert the user. Change its background color to pink, and once it's done return to the original color.

$("#go").click(function(){
  $(".block").animate( { backgroundColor: 'pink' }, 1000)
    .animate( { backgroundColor: 'blue' }, 1000);
});

<html>

</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  {{#if:  |{{{inhead}}}|}}
  <script>
  $(document).ready(function(){
    $("#go").click(function(){
  $(".block").animate( { backgroundColor: 'pink' }, 1000)
    .animate( { backgroundColor: 'blue' }, 1000);
});
  });
  </script>
  {{#if: .block { 
   background-color: blue; 
   width: 150px; 
   height: 70px;
   margin: 10px; 
} |<style>.block { 
   background-color: blue; 
   width: 150px; 
   height: 70px;
   margin: 10px; 
}</style>|}}
</head>
<body>
  <script src="http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js"></script>
<button id="go">» Run</button>
<div class="block"></div>

</body>
</html>

<html>

</html>|}} {{#if: <script src="http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js"></script> <button id="go">» Run</button> <div class="block"></div> || {{#if: The div's background color transitions to a light blue color,
and then changes back to its original blue color. |<html>

</html> The div's background color transitions to a light blue color,
and then changes back to its original blue color.<html>

</html>|}}}}

Removed Functionality

We've removed a number of methods in jQuery 1.2 that were relatively unused, causing confusion, or were inefficient. Wherever possible, we've provided alternate methods for performing the actions.

With jQuery 1.2, as with the jQuery 1.1 release, a backwards compatibility plugin has been provided. Thus, if you wish to continue using these particular methods, you'll be able to use that plugin and continue doing so.

Additionally, in order to handle the XPath changes another, separate, plugin has been made available that will handle XPath selector functionality in jQuery.

Selectors

$("div//p") XPath Descendant Selector
Please use the CSS $("div p") selector instead. Or, use the XPath Compatibility Plugin.

$("div/p") XPath Child Selector
Please use the CSS $("div > p") selector instead. Or, use the XPath Compatibility Plugin.

$("p/../div") XPath Parent Selector
Please use the $("p").parent("div") selector instead. Or, use the XPath Compatibility Plugin.

$("div[p]") XPath Contains Predicate Selector
Please use the new $("div:has(p)") selector instead. Or, use the XPath Compatibility Plugin.

$("a[@href]") XPath Attribute Selector
Note: While this selector is deprecated, it has not yet been removed as of this release (jQuery 1.2).
It is now recommended that you use the CSS selector $("a[href]") instead. Or, use the XPath Compatibility Plugin.

DOM Manipulation

$("div").clone(false)
Calling the clone method with an argument is being deprecated (the clone method, as a whole, is being kept). Instead of calling .clone(false) you should now do: .clone().empty() instead.

DOM Traversing

$("div").eq(0)
This method is being deprecated for the use of the new .slice() method (which works identically to an array's slice method). You can duplicate .eq() like so:

$("div").slice(0,1);

Additionally, .eq(0) can be duplicated in the following ways:

$("div:eq(0)")
$("div:first")

$("div").lt(2)
This method is being deprecated for the use of the new .slice() method (which works identically to an array's slice method). You can duplicate .lt() like so:

$("div").slice(0,2);

Additionally, .lt(2) can be duplicated in the following way:

$("div:lt(2)")

$("div").gt(2)
This method is being deprecated for the use of the new .slice() method (which works identically to an array's slice method). You can duplicate .gt() like so:

$("div").slice(3);

Additionally, .gt(2) can be duplicated in the following way:

$("div:gt(2)")

$("div").contains('text')
This method is being deprecated in favor of just using a regular .filter() statement. You can duplicate .contains() like so:

$("div").filter(":contains(Your Text)");

Ajax

$("#elem").loadIfModified("some.php")
This convenience method is being removed in favor of the long form use of $.ajax():

$.ajax({
  url: "some.php",
  ifModified: true,
  success: function(html){
    $("#elem").html(html);
  }
});

$.getIfModified("some.php")
This convenience method is being removed in favor of the long form use of $.ajax():

$.ajax({
  url: "some.php",
  ifModified: true
});

$.ajaxTimeout(3000)
This convenience method is being removed in favor of the long form use of the more-explicit $.ajaxSetup():

$.ajaxSetup({timeout: 3000});

$(...).evalScripts()
This method is no longer necessary in jQuery - all scripts included in HTML strings are automatically evaluated when injected into the document. No substitute method is needed.

Release:jQuery 1.2

出自Guoshuang Wiki

Downloading

New Features

How To Upgrade

New Plugins

jQuery 1.1 Compatibility Plugin

XPath Compatibility Plugin

Color Animation Plugin

Removed Functionality

Selectors

DOM Manipulation

DOM Traversing

Ajax

查看

个人工具

导航

链接

留言

搜索

工具箱