本错误涵盖了好多错误,主要的原因就是函数不明确,不知道如何使用,以及函数的参数的设定,所以这里大家要先去看函数,另外,最主要的问题就是影像集合和影像要区分开,否则就会出现xxx is nor a function。这里我们用要注意!!!
Line 9: image.select(...).rgbToHsv is not a function
原始代码:
var roi =
/* color: #0000ff */
/* displayProperties: [
"type": "rectangle"
ee.Geometry.Polygon(
[[[30.428288742441815, -22.966276755152105],
[30.428288742441815, -23.010840796597776],
[30.510514542002362, -23.010840796597776],
[30.510514542002362, -22.966276755152105]]], null, false);
// load Landsat 7 TOA reflecteance image
var image= ee.ImageCollection ('
jQuery1.2 API 中文版折叠展开折叠全部展开全部 英文说明 核心jQuery 核心
函数
jQuery(expression,[context])
jQuery(expression,[context])
这个
函数
接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素。
jQuery 的核心功能都是通过这个
函数
实现的。 jQuery中的一切都构建于这个
函数
之上,或者说都是在以某种方式使用这个
函数
。这个
函数
最基本的用法就是向它传递一个表达式(通常由 CSS 选择器组成),然后根据这个表达式来查找所有匹配的元素。
默认情况下, 如果没有指定context参数,$()将在当前的 HTML 文档中查找 DOM 元素;如果指定了 context 参数,如一个 DOM 元素集或 jQuery 对象,那就会在这个 context 中查找。
参考
Select
ors 获取更多用于 expression 参数的 CSS 语法的信息。
--------------------------------------------------------------------------------
Th
is
function
accepts a string containing a CSS
select
or which is
th
en used to match a set of elements.
Th
e core
function
ality of jQuery centers around
th
is
function
. Every
th
ing in jQuery is based upon
th
is, or uses
th
is in some way.
Th
e most basic use of
th
is
function
is to pass in an expression (usually consisting of CSS), which
th
en finds all matching elements.
By default, if no context is specified, $() looks for DOM elements wi
th
in
th
e context of
th
e current HTML document. If you do specify a context, such as a DOM element or jQuery object,
th
e expression will be matched against
th
e contents of
th
at context.
See
Select
ors for
th
e allowed CSS syntax for expressions.
jQuery
expression (String) : 用来查找的字符串
context (Element, jQuery) : (可选) 作为待查找的 DOM 元素集、文档或 jQuery 对象。
找到所有 p 元素,并且这些元素都必须是 div 元素的子元素。
HTML 代码:
<p>one</p> <div><p>two</p></div> <p>
th
ree</p>
jQuery 代码:
$("div > p");
[ <p>two</p> ]
--------------------------------------------------------------------------------
在文档的第一个表单中,查找所有的单选按钮(即: type 值为 radio 的 input 元素)。
jQuery 代码:
$("input:radio", document.forms[0]);
--------------------------------------------------------------------------------
在一个由 AJAX 返回的 XML 文档中,查找所有的 div 元素。
jQuery 代码:
$("div", xml.responseXML);
jQuery(html)jQuery(html)
根据提供的原始 HTML 标记字符串,动态创建由 jQuery 对象包装的 DOM 元素。
你可以传递一个手写的 HTML 字符串,或者由某些模板引擎或插件创建的字符串,也可以是通过 AJAX 加载过来的字符串。但是在你创建 input 元素的时会有限制,可以参考第二个示例。当然这个字符串可以包含斜杠 (比如一个图像地址),还有反斜杠。当你创建单个元素时,请使用闭合标签或 XHTML 格式。例如,创建一个 span ,可以用 $("<span/>") 或 $("<span></span>") ,但不推荐 $("<span>")
--------------------------------------------------------------------------------
Create DOM elements on-
th
e-fly from
th
e provided String of raw HTML.
You can pass in plain HTML Strings written by hand, create
th
em using some template
engine
or plugin, or load
th
em via AJAX.
Th
ere are limitations when creating input elements, see
th
e second example. Also when passing strings
th
at may include slashes (such as an
image
pa
th
), escape
th
e slashes. When creating single elements use
th
e closing tag or XHTML format. For example, to create a span use $("<span/>") or $("<span></span>") instead of wi
th
out
th
e closing slash/tag.
jQuery
html (String) : 用于动态创建DOM元素的HTML标记字符串
动态创建一个 div 元素(以及其中的所有内容),并将它追加到 body 元素中。在这个
函数
的内部,是通过临时创建一个元素,并将这个元素的 innerHTML 属性设置为给定的标记字符串,来实现标记到 DOM 元素转换的。所以,这个
函数
既有灵活性,也有局限性。
jQuery 代码:
$("<div><p>Hello</p></div>").appendTo("body");
--------------------------------------------------------------------------------
创建一个 <input> 元素必须同时设定 type 属性。因为微软规定 <input> 元素的 type 只能写一次。
jQuery 代码:
// 在 IE 中无效:
$("<input>").attr("type", "checkbox");
// 在 IE 中有效:
$("<input type='checkbox'>");
jQuery(elements)jQuery(elements)
将一个或多个DOM元素转化为jQuery对象。
这个
函数
也可以接收XML文档和Window对象(虽然它们不是DOM元素)作为有效的参数。
--------------------------------------------------------------------------------
Wrap jQuery
function
ality around a single or multiple DOM Element(s).
Th
is
function
also accepts XML Documents and Window objects as valid arguments (even
th
ough
th
ey are not DOM Elements).
jQuery
elements (Element, Array<Element>) : 用于封装成jQuery对象的DOM元素
设置页面背景色。
jQuery 代码:
$(document.body).css( "background", "black" );
--------------------------------------------------------------------------------
隐藏一个表单中所有元素。
jQuery 代码:
$(myForm.elements).hide() jQuery(callback)jQuery(callback)
$(document).ready()的简写。
允许你绑定一个在DOM文档载入完成后执行的
函数
。这个
函数
的作用如同$(document).ready()一样,只不过用这个
函数
时,需要把页面中所有需要在 DOM 加载完成时执行的$()操作符都包装到其中来。从技术上来说,这个
函数
是可链接的--但真正以这种方式链接的情况并不多。
你可以在一个页面中使用任意多个$(document).ready事件。
参考 ready(
Function
) 获取更多 ready 事件的信息。
--------------------------------------------------------------------------------
A shor
th
and for $(document).ready().
Allows you to bind a
function
to be executed when
th
e DOM document has finished loading.
Th
is
function
behaves just like $(document).ready(), in
th
at it should be used to wrap o
th
er $() operations on your page
th
at depend on
th
e DOM being ready to be operated on. While
th
is
function
is, technically, chainable -
th
ere really isn't much use for chaining against it.
You can have as many $(document).ready events on your page as you like.
See ready(
Function
) for details about
th
e ready event.
jQuery
callback (
Function
) : 当DOM加载完成后要执行的
函数
当DOM加载完成后,执行其中的
函数
。
jQuery 代码:
$(
function
(){
// Document is ready
--------------------------------------------------------------------------------
Uses bo
th
th
e shortcut for $(document).ready() and
th
e argument to write failsafe jQuery code using
th
e $ alias, wi
th
out relying on
th
e global alias.
jQuery 代码:
jQuery(
function
($) {
// Your code using failsafe $ alias here...
}); jQuery 对象访问
each(callback)each(callback)
以每一个匹配的元素作为上下文来执行一个
函数
。
意味着,每次执行传递进来的
函数
时,
函数
中的
th
is关键字都指向一个不同的DOM元素(每次都是一个不同的匹配元素)。
而且,在每次执行
函数
时,都会给
函数
传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数(从零开始的整形)。
返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。
--------------------------------------------------------------------------------
Execute a
function
wi
th
in
th
e context of every matched element.
Th
is means
th
at every time
th
e passed-in
function
is executed (which is once for every element matched)
th
e '
th
is' keyword points to
th
e specific DOM element.
Additionally,
th
e
function
, when executed, is passed a single argument representing
th
e position of
th
e element in
th
e matched set (integer, zero-index).
Returning 'false' from wi
th
in
th
e each
function
completely stops
th
e loop
th
rough all of
th
e elements (
th
is is like using a 'break' wi
th
a normal loop). Returning 'true' from wi
th
in
th
e loop skips to
th
e next iteration (
th
is is like using a 'continue' wi
th
a normal loop).
jQuery
callback (
Function
) : 对于每个匹配的元素所要执行的
函数
迭代两个图像,并设置它们的 src 属性。注意:此处
th
is 指代的是 DOM 对象而非 jQuery 对象。
HTML 代码:
<img/><img/>
jQuery 代码:
$("img").each(
function
(i){
th
is.src = "test" + i + ".jpg";
[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]
--------------------------------------------------------------------------------
如果你想得到 jQuery对象,可以使用 $(
th
is)
函数
。
jQuery 代码:
$("img").each(
function
(){
$(
th
is).toggleClass("example");
--------------------------------------------------------------------------------
你可以使用 'return' 来提前跳出 each() 循环。
HTML 代码:
<button>Change colors</button>
<span></span>
<div></div>
<div></div>
<div></div>
<div></div>
<div id="stop">Stop here</div>
<div></div>
<div></div>
<div></div>
jQuery 代码:
$("button").click(
function
() {
$("div").each(
function
(index, domEle) {
// domEle ==
th
is
$(domEle).css("backgroundColor", "yellow");
if ($(
th
is).is("#stop")) {
$("span").text("Stopped at div index #" + index);
return false;
});size()size()
jQuery 对象中元素的个数。
这个
函数
的返回值与 jQuery 对象的'leng
th
' 属性一致。
--------------------------------------------------------------------------------
Th
e number of elements in
th
e jQuery object.
Th
is returns
th
e same number as
th
e 'leng
th
' property of
th
e jQuery object.
Number
计算文档中所有图片数量
HTML 代码:
<img src="test1.jpg"/> <img src="test2.jpg"/>
jQuery 代码:
$("img").size();
2 leng
th
leng
th
jQuery 对象中元素的个数。
当前匹配的元素个数。 size 将返回相同的值。
--------------------------------------------------------------------------------
Th
e number of elements in
th
e jQuery object.
Th
e number of elements currently matched.
Th
e size
function
will return
th
e same value.
Number
计算文档中所有图片数量
HTML 代码:
<img src="test1.jpg"/> <img src="test2.jpg"/>
jQuery 代码:
$("img").leng
th
;
2 get()get()
取得所有匹配的 DOM 元素集合。
这是取得所有匹配元素的一种向后兼容的方式(不同于jQuery对象,而实际上是元素数组)。
如果你想要直接操作 DOM 对象而不是 jQuery 对象,这个
函数
非常有用。
--------------------------------------------------------------------------------
Access all matched DOM elements.
Th
is serves as a backwards-compatible way of accessing all matched elements (o
th
er
th
an
th
e jQuery object itself, which is, in fact, an array of elements). It is useful if you need to operate on
th
e DOM elements
th
emselves instead of using built-in jQuery
function
s.
Array<Element>
选择文档中所有图像作为元素数组,并用数组内建的 reverse 方法将数组反向。
HTML 代码:
<img src="test1.jpg"/> <img src="test2.jpg"/>
jQuery 代码:
$("img").get().reverse();
[ <img src="test2.jpg"/> <img src="test1.jpg"/> ] get(index)get(index)
取得其中一个匹配的元素。 num表示取得第几个匹配的元素。
这能够让你选择一个实际的DOM 元素并且对他直接操作,而不是通过 jQuery
函数
。$(
th
is).get(0)与$(
th
is)[0]等价。
--------------------------------------------------------------------------------
Access a single matched DOM element at a specified index in
th
e matched set.
Th
is allows you to extract
th
e actual DOM element and operate on it directly wi
th
out necessarily using jQuery
function
ality on it.
Th
is
function
called as $(
th
is).get(0) is
th
e equivalent of using square bracket notation on
th
e jQuery object itself like $(
th
is)[0].
Element
index (Number) :取得第 index 个位置上的元素
HTML 代码:
<img src="test1.jpg"/> <img src="test2.jpg"/>
jQuery 代码:
$("img").get(0);
[ <img src="test1.jpg"/> ] index(subject)index(subject)
搜索与参数表示的对象匹配的元素,并返回相应元素的索引值值。
如果找到了匹配的元素,从0开始返回;如果没有找到匹配的元素,返回-1。
--------------------------------------------------------------------------------
S
ear
ches every matched element for
th
e object and returns
th
e index of
th
e element, if found, starting wi
th
zero.
Returns -1 if
th
e object wasn't found.
Number
subject (Element) : 要搜索的对象
返回ID值为foobar的元素的索引值值。
HTML 代码:
<div id="foobar"><b></b><span id="foo"></span></div>
jQuery 代码:
$("*").index($('#foobar')[0])
5 插件机制
jQuery.fn.extend(object)jQuery.fn.extend(object)
扩展 jQuery 元素集来提供新的方法(通常用来制作插件)。
查看这里Plugins/Au
th
oring可以获取更多信息。
--------------------------------------------------------------------------------
Extends
th
e jQuery element set to provide new me
th
ods (used to make a typical jQuery plugin).
Can be used to add
function
s into
th
e to add plugin me
th
ods (plugins).
jQuery
object (Object) :用来扩充 jQuery 对象。
增加两个插件方法。
jQuery 代码:
jQuery.fn.extend({
check:
function
() {
return
th
is.each(
function
() {
th
is.checked = true; });
uncheck:
function
() {
return
th
is.each(
function
() {
th
is.checked = false; });
$("input[@type=checkbox]").check();
$("input[@type=radio]").uncheck(); jQuery.extend(object)jQuery.extend(object)
扩展jQuery对象本身。
用来在jQuery命名空间上增加新
函数
。 查看 'jQuery.fn.extend' 获取更多添加插件的信息。
--------------------------------------------------------------------------------
Extends
th
e jQuery object itself.
Can be used to add
function
s into
th
e jQuery namespace. See 'jQuery.fn.extend' for more information on using
th
is me
th
od to add Plugins.
jQuery
object (Object) : 用以扩展 jQuery 对象
在jQuery命名空间上增加两个
函数
。
jQuery 代码:
jQuery.extend({
min:
function
(a, b) { return a < b ? a : b; },
max:
function
(a, b) { return a > b ? a : b; }
jQuery.min(2,3); // => 2
jQuery.max(4,5); // => 5 多库共存
jQuery.noConflict()jQuery.noConflict()
运行这个
函数
将变量$的控制权让渡给第一个实现它的那个库。
这有助于确保jQuery不会与其他库的$对象发生冲突。在运行这个
函数
后,就只能使用jQuery变量访问jQuery对象。例如,在要用到$("div p")的地方,就必须换成jQuery("div p")。
--------------------------------------------------------------------------------
Run
th
is
function
to give control of
th
e $ variable back to whichever library first implemented it.
Th
is helps to make sure
th
at jQuery doesn't conflict wi
th
th
e $ object of o
th
er libraries. By using
th
is
function
, you will only be able to access jQuery using
th
e 'jQuery' variable. For example, where you used to do $("div p"), you now must do jQuery("div p").
jQuery
将$引用的对象映射回原始的对象。
jQuery 代码:
jQuery.noConflict();
// 使用 jQuery
jQuery("div p").hide();
// 使用其他库的 $()
$("content").style.display = 'none';
--------------------------------------------------------------------------------
恢复使用别名$,然后创建并执行一个
函数
,在这个
函数
的作用域中仍然将$作为jQuery的别名来使用。在这个
函数
中,原来的$对象是无效的。这个
函数
对于大多数不依赖于其他库的插件都十分有效。
jQuery 代码:
jQuery.noConflict();
(
function
($) {
$(
function
() {
// 使用 $ 作为 jQuery 别名的代码
})(jQuery);
// 其他用 $ 作为别名的库的代码
--------------------------------------------------------------------------------
创建一个新的别名用以在接下来的库中使用jQuery对象。
jQuery 代码:
var j = jQuery.noConflict();
// 基于 jQuery 的代码
j("div p").hide();
// 基于其他库的 $() 代码
$("content").style.display = 'none'; jQuery.noConflict(extreme)jQuery.noConflict(extreme)
将$和jQuery的控制权都交还给原来的库。用之前请考虑清楚!
这是相对于简单的 noConflict 方法更极端的版本,因为这将完全重新定义jQuery。这通常用于一种极端的情况,比如你想要将jQuery嵌入一个高度冲突的环境。注意:调用此方法后极有可能导致插件失效。
--------------------------------------------------------------------------------
Revert control of bo
th
th
e $ and jQuery variables to
th
eir original owners. Use wi
th
discretion.
Th
is is a more-extreme version of
th
e simple noConflict me
th
od, as
th
is one will completely undo what jQuery has introduced.
Th
is is to be used in an extreme case where you'd like to embed jQuery into a high-conflict environment. NOTE: It's very likely
th
at plugins won't work after
th
is particular me
th
od has been called.
jQuery
extreme (Boolean) : 传入 true 来允许彻底将jQuery变量还原
完全将 jQuery 移到一个新的命名空间。
jQuery 代码:
var dom = {};
dom.query = jQuery.noConflict(true);
// 新 jQuery 的代码
dom.query("div p").hide();
// 另一个库 $() 的代码
$("content").style.display = 'none';
// 另一个版本 jQuery 的代码
jQuery("div > p").hide(); 选择器基本
#id#id
根据给定的ID匹配一个元素。
--------------------------------------------------------------------------------
Matches a single element wi
th
th
e given id attribute.
Element
id (String) : 用于搜索的,通过元素的 id 属性中给定的值
查找 ID 为"myDiv"的元素。
HTML 代码:
<div id="notMe"><p>id="notMe"</p></div>
<div id="myDiv">id="myDiv"</div>
jQuery 代码:
$("#myDiv");
[ <div id="myDiv">id="myDiv"</div> ] elementelement
根据给定的元素名匹配所有元素
--------------------------------------------------------------------------------
Matches all elements wi
th
th
e given name.
Array<Element>
element (String) : 一个用于搜索的元素。指向 DOM 节点的标签名。
查找一个 DIV 元素。
HTML 代码:
<div>DIV1</div>
<div>DIV2</div>
<span>SPAN</span>
jQuery 代码:
$("div");
[ <div>DIV1</div>, <div>DIV2</div> ] .class.class
根据给定的类匹配元素。
--------------------------------------------------------------------------------
Matches all elements wi
th
th
e given class.
Array<Element>
class (String) : 一个用以搜索的类。一个元素可以有多个类,只要有一个符合就能被匹配到。
查找所有类是 "myClass" 的元素.
HTML 代码:
<div class="notMe">div class="notMe"</div>
<div class="myClass">div class="myClass"</div>
<span class="myClass">span class="myClass"</span>
jQuery 代码:
$(".myClass");
[ <div class="myClass">div class="myClass"</div>, <span class="myClass">span class="myClass"</span> ] **
匹配所有元素
多用于结合上下文来搜索。
--------------------------------------------------------------------------------
Matches all elements.
Most useful when combined wi
th
a context to s
ear
ch in.
Array<Element>
找到每一个元素
HTML 代码:
<div>DIV</div>
<span>SPAN</span>
<p>P</p>
jQuery 代码:
$("*")
[ <div>DIV</div>, <span>SPAN</span>, <p>P</p> ]
select
or1,
select
or2,
select
orN
select
or1,
select
or2,
select
orN
将每一个选择器匹配到的元素合并后一起返回。
你可以指定任意多个选择器,并将匹配到的元素合并到一个结果内。
--------------------------------------------------------------------------------
Matches
th
e combined results of all
th
e specified
select
ors.
You can specify any number of
select
ors to combine into a single result.
Array<Element>
select
or1 (
Select
or) : 一个有效的选择器
select
or2 (
Select
or) : 另一个有效的选择器
select
orN (
Select
or) : (可选) 任意多个有效选择器
找到匹配任意一个类的元素。
HTML 代码:
<div>div</div>
<p class="myClass">p class="myClass"</p>
<span>span</span>
<p class="notMyClass">p class="notMyClass"</p>
jQuery 代码:
$("div,span,p.myClass")
[ <div>div</div>, <p class="myClass">p class="myClass"</p>, <span>span</span> ] 层级
ancestor descendantancestor descendant
在给定的祖先元素下匹配所有的后代元素
--------------------------------------------------------------------------------
Matches all descendant elements specified by descendant of elements specified by ancestor.
Array<Element>
ancestor (
Select
or) : 任何有效选择器
descendant (
Select
or) : 用以匹配元素的选择器,并且它是第一个选择器的后代元素
找到表单中所有的 input 元素
HTML 代码:
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery 代码:
$("form input")
[ <input name="name" />, <input name="newsletter" /> ] parent > childparent > child
在给定的父元素下匹配所有的子元素
--------------------------------------------------------------------------------
Matches all child elements specified by child of elements specified by parent.
Array<Element>
parent (
Select
or) : 任何有效选择器
child (
Select
or) : 用以匹配元素的选择器,并且它是第一个选择器的子元素
匹配表单中所有的子级input元素。
HTML 代码:
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery 代码:
$("form > input")
[ <input name="name" /> ] prev + nextprev + next
匹配所有紧接在 prev 元素后的 next 元素
--------------------------------------------------------------------------------
Matches all next elements specified by next
th
at are next to elements specified by prev.
Array<Element>
prev (
Select
or) : 任何有效选择器
next (
Select
or) :一个有效选择器并且紧接着第一个选择器
匹配所有跟在 label 后面的 input 元素
HTML 代码:
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery 代码:
$("label + input")
[ <input name="name" />, <input name="newsletter" /> ] prev ~ siblingsprev ~ siblings
匹配 prev 元素之后的所有 siblings 元素
--------------------------------------------------------------------------------
Matches all sibling elements after
th
e "prev" element
th
at match
th
e filtering "siblings"
select
or.
Array<Element>
prev (
Select
or) : 任何有效选择器
siblings (
Select
or) : 一个选择器,并且它作为第一个选择器的同辈
找到所有与表单同辈的 input 元素
HTML 代码:
<label>Name:</label>
<input name="name" />
<fieldset>
<label>Newsletter:</label>
<input name="newsletter" />
</fieldset>
</form>
<input name="none" />
jQuery 代码:
$("form ~ input")
[ <input name="none" /> ] 简单
:first:first
匹配找到的第一个元素
--------------------------------------------------------------------------------
Matches
th
e first
select
ed element.
Element
查找表格的第一行
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:first")
[ <tr><td>Header 1</td></tr> ] :last:last
匹配找到的最后一个元素
--------------------------------------------------------------------------------
Matches
th
e last
select
ed element.
Element
查找表格的最后一行
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:last")
[ <tr><td>Value 2</td></tr> ] :not(
select
or):not(
select
or)
去除所有与给定选择器匹配的元素
--------------------------------------------------------------------------------
Removes all elements matching
th
e given
select
or.
Array<Element>
select
or (
Select
or) : 用于筛选的选择器
查找所有未选中的 input 元素
HTML 代码:
<input name="apple" />
<input name="flower" checked="checked" />
jQuery 代码:
$("input:not(:checked)")
[ <input name="apple" /> ] :even:even
匹配所有索引值为偶数的元素,从 0 开始计数
--------------------------------------------------------------------------------
Matches even elements, zero-indexed.
Array<Element>
查找表格的1、3、5...行(即索引值0、2、4...)
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:even")
[ <tr><td>Header 1</td></tr>, <tr><td>Value 2</td></tr> ] :odd:odd
匹配所有索引值为奇数的元素,从 0 开始计数
--------------------------------------------------------------------------------
Matches odd elements, zero-indexed.
Array<Element>
查找表格的2、4、6行(即索引值1、3、5...)
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:odd")
[ <tr><td>Value 1</td></tr> ] :eq(index):eq(index)
匹配一个给定索引值的元素
--------------------------------------------------------------------------------
Matches a single element by its index.
Element
index (Number) : 从 0 开始计数
查找第二行
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:eq(1)")
[ <tr><td>Value 1</td></tr> ] :gt(index):gt(index)
匹配所有大于给定索引值的元素
--------------------------------------------------------------------------------
Matches all elements wi
th
an index above
th
e given one.
Array<Element>
index (Number) : 从 0 开始计数
查找第二第三行,即索引值是1和2,也就是比0大
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:gt(0)")
[ <tr><td>Value 1</td></tr>, <tr><td>Value 2</td></tr> ] :lt(index):lt(index)
匹配所有小于给定索引值的元素
--------------------------------------------------------------------------------
Matches all elements wi
th
an index below
th
e given one.
Array<Element>
index (Number) : 从 0 开始计数
查找第一第二行,即索引值是0和1,也就是比2小
HTML 代码:
<table>
<tr><td>Header 1</td></tr>
<tr><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:lt(2)")
[ <tr><td>Header 1</td></tr>, <tr><td>Value 1</td></tr> ] :header:header
匹配如 h1, h2, h3之类的标题元素
--------------------------------------------------------------------------------
Matches all elements
th
at are headers, like h1, h2, h3 and so on.
Array<Element>
给页面内所有标题加上背景色
HTML 代码:
<h1>Header 1</h1>
<p>Contents 1</p>
<h2>Header 2</h2>
<p>Contents 2</p>
jQuery 代码:
$(":header").css("background", "#EEE");
[ <h1 style="background:#EEE;">Header 1</h1>, <h2 style="background:#EEE;">Header 2</h2> ] :animated:animated
匹配所有没有在执行动画效果中的元素
--------------------------------------------------------------------------------
Matches all elements
th
at are currently being animated.
Array<Element>
只有对不在执行动画效果的元素执行一个动画特效
HTML 代码:
<button id="run">Run</button><div></div>
jQuery 代码:
$("#run").click(
function
(){
$("div:not(:animated)").animate({ left: "+20" }, 1000);
}); 内容
:contains(text):contains(text)
匹配包含给定文本的元素
--------------------------------------------------------------------------------
Matches elements which contain
th
e given text.
Array<Element>
text (String) : 一个用以查找的字符串
查找所有包含 "John" 的 div 元素
HTML 代码:
<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn
jQuery 代码:
$("div:contains('John')")
[ <div>John Resig</div>, <div>Malcom John Sinclair</div> ] :empty:empty
匹配所有不包含子元素或者文本的空元素
--------------------------------------------------------------------------------
Matches all elements
th
at are empty, be it elements or text.
Array<Element>
查找所有不包含子元素或者文本的空元素
HTML 代码:
<table>
<tr><td>Value 1</td><td></td></tr>
<tr><td>Value 2</td><td></td></tr>
</table>
jQuery 代码:
$("td:empty")
[ <td></td>, <td></td> ] :has(
select
or):has(
select
or)
匹配含有选择器所匹配的元素的元素
--------------------------------------------------------------------------------
Matches elements which contain at least one element
th
at matches
th
e specified
select
or.
Array<Element>
select
or (
Select
or) : 一个用于筛选的选择器
给所有包含 p 元素的 div 元素添加一个 text 类
HTML 代码:
<div><p>Hello</p></div>
<div>Hello again!</div>
jQuery 代码:
$("div:has(p)").addClass("test");
[ <div class="test"><p>Hello</p></div> ] :parent:parent
匹配含有子元素或者文本的元素
--------------------------------------------------------------------------------
Matches all elements
th
at are parents -
th
ey have child elements, including text.
Array<Element>
查找所有含有子元素或者文本的 td 元素
HTML 代码:
<table>
<tr><td>Value 1</td><td></td></tr>
<tr><td>Value 2</td><td></td></tr>
</table>
jQuery 代码:
$("td:parent")
[ <td>Value 1</td>, <td>Value 1</td> ] 可见性
:hidden:hidden
匹配所有的不可见元素,input 元素的 type 属性为 "hidden" 的话也会被匹配到
--------------------------------------------------------------------------------
Matches all elements
th
at are hidden, or input elements of type "hidden".
Array<Element>
查找所有不可见的 tr 元素
HTML 代码:
<table>
<tr style=""><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:hidden")
[ <tr style=""><td>Value 1</td></tr> ] :visible:visible
匹配所有的可见元素
--------------------------------------------------------------------------------
Matches all elements
th
at are visible.
Array<Element>
查找所有可见的 tr 元素
HTML 代码:
<table>
<tr style=""><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:visible")
[ <tr><td>Value 2</td></tr> ] 属性
[attribute][attribute]
匹配包含给定属性的元素
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute.
Array<Element>
attribute (String) : 属性名
查找所有含有 id 属性的 div 元素
HTML 代码:
<p>Hello!</p>
<div id="test2"></div>
jQuery 代码:
$("div[id]")
[ <div id="test2"></div> ] [attribute=value][attribute=value]
匹配给定的属性是某个特定值的元素
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute wi
th
a certain value.
Array<Element>
attribute (String) : 属性名
value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。
查找所有 name 属性是 newsletter 的 input 元素
HTML 代码:
'<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代码:
$("input[name='newsletter']").attr("checked", true);
[ <input type="checkbox" name="newsletter" value="Hot Fuzz" checked="true" />, <input type="checkbox" name="newsletter" value="Cold Fusion" checked="true" /> ] [attribute!=value][attribute!=value]
匹配给定的属性是不包含某个特定值的元素
--------------------------------------------------------------------------------
Matches elements
th
at don't have
th
e specified attribute wi
th
a certain value.
Array<Element>
attribute (String) : 属性名
value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。
查找所有 name 属性不是 newsletter 的 input 元素
HTML 代码:
'<input type="checkbox" name="newsletter" value="Hot Fuzz" />
<input type="checkbox" name="newsletter" value="Cold Fusion" />
<input type="checkbox" name="accept" value="Evil Plans" />
jQuery 代码:
$("input[name!='newsletter']").attr("checked", true);
[ <input type="checkbox" name="accept" value="Evil Plans" checked="true" /> ] [attribute^=value][attribute^=value]
匹配给定的属性是以某些值开始的元素
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute and it starts wi
th
a certain value.
Array<Element>
attribute (String) : 属性名
value ( String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。
查找所有 name 以 'news' 开始的 input 元素
HTML 代码:
<input name="newsletter" />
<input name="milkman" />
<input name="newsboy" />
jQuery 代码:
$("input[name^='news']")
[ <input name="newsletter" />, <input name="newsboy" /> ] [attribute$=value][attribute$=value]
匹配给定的属性是以某些值结尾的元素
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute and it ends wi
th
a certain value.
Array<Element>
attribute (String) : 属性名
value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。
查找所有 name 以 'letter' 结尾的 input 元素
HTML 代码:
<input name="newsletter" />
<input name="milkman" />
<input name="jobletter" />
jQuery 代码:
$("input[name$='letter']")
[ <input name="newsletter" />, <input name="jobletter" /> ] [attribute*=value][attribute*=value]
匹配给定的属性是以包含某些值的元素
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute and it contains a certain value.
Array<Element>
attribute (String) : 属性名
value (String) : 属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时,用以避免冲突。
查找所有 name 包含 'man' 的 input 元素
HTML 代码:
<input name="man-news" />
<input name="milkman" />
<input name="letterman2" />
<input name="newmilk" />
jQuery 代码:
$("input[name*='man']")
[ <input name="man-news" />, <input name="milkman" />, <input name="letterman2" /> ] [
select
or1][
select
or2][
select
orN][
select
or1][
select
or2][
select
orN]
复合属性选择器,需要同时满足多个条件时使用。
--------------------------------------------------------------------------------
Matches elements
th
at have
th
e specified attribute and it contains a certain value.
Array<Element>
select
or1 (
Select
or) : 属性选择器
select
or2 (
Select
or) : 另一个属性选择器,用以进一步缩小范围
select
orN (
Select
or) : 任意多个属性选择器
找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的
HTML 代码:
<input id="man-news" name="man-news" />
<input name="milkman" />
<input id="letterman" name="new-letterman" />
<input name="newmilk" />
jQuery 代码:
$("input[id][name$='man']")
[ <input id="letterman" name="new-letterman" /> ] 子元素
:n
th
-child(index/even/odd/equation):n
th
-child(index/even/odd/equation)
匹配其父元素下的第N个子或奇偶元素
':eq(index)' 只匹配一个元素,而这个将为每一个父元素匹配子元素。:n
th
-child从1开始的,而:eq()是从0算起的!
可以使用:
n
th
-child(even)
:n
th
-child(odd)
:n
th
-child(3n)
:n
th
-child(2)
:n
th
-child(3n+1)
:n
th
-child(3n+2)
--------------------------------------------------------------------------------
Matches
th
e n
th
-child of its parent.
While ':eq(index)' matches only a single element,
th
is matches more
th
en one: One for each parent.
Th
e specified index is one-indexed, in contrast to :eq() which starst at zero.
Array<Element>
index (Number) : 要匹配元素的序号,从1开始
在每个 ul 查找第 2 个li
HTML 代码:
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
jQuery 代码:
$("ul li:n
th
-child(2)")
[ <li>Karl</li>, <li>Tane</li> ] :first-child:first-child
匹配第一个子元素
':first' 只匹配一个元素,而此选择符将为每个父元素匹配一个子元素
--------------------------------------------------------------------------------
Matches
th
e first child of its parent.
While ':first' matches only a single element,
th
is matches more
th
en one: One for each parent.
Array<Element>
在每个 ul 中查找第一个 li
HTML 代码:
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
jQuery 代码:
$("ul li:first-child")
[ <li>John</li>, <li>Glen</li> ] :last-child:last-child
匹配最后一个子元素
':last'只匹配一个元素,而此选择符将为每个父元素匹配一个子元素
--------------------------------------------------------------------------------
Matches
th
e last child of its parent.
While ':last' matches only a single element,
th
is matches more
th
en one: One for each parent.
Array<Element>
在每个 ul 中查找最后一个 li
HTML 代码:
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
<li>Glen</li>
<li>Tane</li>
<li>Ralph</li>
jQuery 代码:
$("ul li:last-child")
[ <li>Brandon</li>, <li>Ralph</li> ] :only-child:only-child
如果某个元素是父元素中唯一的子元素,那将会被匹配
如果父元素中含有其他元素,那将不会被匹配。
--------------------------------------------------------------------------------
Matches
th
e only child of its parent.
If
th
e parent has o
th
er child elements, no
th
ing is matched.
Array<Element>
在 ul 中查找是唯一子元素的 li
HTML 代码:
<li>John</li>
<li>Karl</li>
<li>Brandon</li>
<li>Glen</li>
jQuery 代码:
$("ul li:only-child")
[ <li>Glen</li> ] 表单
:input:input
匹配所有 input, textarea,
select
和 button 元素
--------------------------------------------------------------------------------
Matches all input, textarea,
select
and button elements.
Array<Element>
查找所有的input元素
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":input")
[ <input type="text" />, <input type="checkbox" />, <input type="radio" />, <input type="
image
" />, <input type="file" />, <input type="submit" />, <input type="reset" />, <input type="password" />, <input type="button" /> ] :text:text
匹配所有的单行文本框
--------------------------------------------------------------------------------
Matches all input elements of type text.
Array<Element>
查找所有文本框
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":text")
[ <input type="text" /> ] :password:password
匹配所有密码框
--------------------------------------------------------------------------------
Matches all input elements of type password.
Array<Element>
查找所有密码框
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":password")
[ <input type="password" /> ] :radio:radio
匹配所有单选按钮
--------------------------------------------------------------------------------
Matches all input elements of type radio.
Array<Element>
查找所有单选按钮
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":radio")
[ <input type="radio" /> ] :checkbox:checkbox
匹配所有复选框
--------------------------------------------------------------------------------
Matches all input elements of type checkbox.
Array<Element>
查找所有复选框
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":checkbox")
[ <input type="checkbox" /> ] :submit:submit
匹配所有提交按钮
--------------------------------------------------------------------------------
Matches all input elements of type submit.
Array<Element>
查找所有提交按钮
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":submit")
[ <input type="submit" /> ] :
image
:
image
匹配所有图像域
--------------------------------------------------------------------------------
Matches all input elements of type
image
.
Array<Element>
匹配所有图像域
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":
image
")
[ <input type="
image
" /> ] :reset:reset
匹配所有重置按钮
--------------------------------------------------------------------------------
Matches all input elements of type reset.
Array<Element>
查找所有重置按钮
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":reset")
[ <input type="reset" /> ] :button:button
匹配所有按钮
--------------------------------------------------------------------------------
Matches all input elements of type button.
Array<Element>
查找所有按钮.
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":button")
[ <input type="button" />,<button></button> ] :file:file
匹配所有文件域
--------------------------------------------------------------------------------
Matches all input elements of type file.
Array<Element>
查找所有文件域
HTML 代码:
<input type="text" />
<input type="checkbox" />
<input type="radio" />
<input type="
image
" />
<input type="file" />
<input type="submit" />
<input type="reset" />
<input type="password" />
<input type="button" />
<
select
><option/></
select
>
<textarea></textarea>
<button></button>
</form>
jQuery 代码:
$(":file")
[ <input type="file" /> ] :hidden:hidden
匹配所有不可见元素,或者type为hidden的元素
--------------------------------------------------------------------------------
Matches all elements
th
at are hidden, or input elements of type "hidden".
Array<Element>
查找隐藏的 tr
HTML 代码:
<table>
<tr style=""><td>Value 1</td></tr>
<tr><td>Value 2</td></tr>
</table>
jQuery 代码:
$("tr:hidden")
[ <tr style=""><td>Value 1</td></tr> ]
--------------------------------------------------------------------------------
匹配type为hidden的元素
HTML 代码:
<input type="text" name="email" />
<input type="hidden" name="id" />
</form>
jQuery 代码:
$("input:hidden")
[ <input type="hidden" name="id" /> ] 表单对象属性
:enabled:enabled
匹配所有可用元素
--------------------------------------------------------------------------------
Matches all elements
th
at are enabled.
Array<Element>
查找所有可用的input元素
HTML 代码:
<input name="email" disabled="disabled" />
<input name="id" />
</form>
jQuery 代码:
$("input:enabled")
[ <input name="id" /> ] :disabled:disabled
匹配所有不可用元素
--------------------------------------------------------------------------------
Matches all elements
th
at are disabled.
Array<Element>
查找所有不可用的input元素
HTML 代码:
<input name="email" disabled="disabled" />
<input name="id" />
</form>
jQuery 代码:
$("input:disabled")
[ <input name="email" disabled="disabled" /> ] :checked:checked
匹配所有选中的复选框元素
--------------------------------------------------------------------------------
Matches all elements
th
at are checked.
Array<Element>
查找所有选中的复选框元素
HTML 代码:
<input type="checkbox" name="newsletter" checked="checked" value="Daily" />
<input type="checkbox" name="newsletter" value="Weekly" />
<input type="checkbox" name="newsletter" checked="checked" value="Mon
th
ly" />
</form>
jQuery 代码:
$("input:checked")
[ <input type="checkbox" name="newsletter" checked="checked" value="Daily" />, <input type="checkbox" name="newsletter" checked="checked" value="Mon
th
ly" /> ] :
select
ed:
select
ed
匹配所有选中的选项元素
--------------------------------------------------------------------------------
Matches all elements
th
at are
select
ed.
Array<Element>
查找所有选中的选项元素
HTML 代码:
<
select
>
<option value="1">Flowers</option>
<option value="2"
select
ed="
select
ed">Gardens</option>
<option value="3">Trees</option>
</
select
>
jQuery 代码:
$("
select
option:
select
ed")
[ <option value="2"
select
ed="
select
ed">Gardens</option> ]
--------------------------------------------------------------------------------
Finds all option elements
th
at are
select
ed.
HTML 代码:
<
select
multiple="multiple">
<option value="1">Flowers</option>
<option value="2"
select
ed="
select
ed">Gardens</option>
<option value="3"
select
ed="
select
ed">Trees</option>
</
select
>
jQuery 代码:
$("
select
option:
select
ed")
[ <option value="2"
select
ed="
select
ed">Gardens</option>, <option value="3"
select
ed="
select
ed">Trees</option> ] 属性属性
attr(name)attr(name)
取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。
--------------------------------------------------------------------------------
Access a property on
th
e first matched element.
Th
is me
th
od makes it easy to retrieve a property value from
th
e first matched element. If
th
e element does not have an attribute wi
th
such a name, undefined is returned.
Object
name (String) : 属性名称
返回文档中第一个图像的src属性值。
HTML 代码:
<img src="test.jpg"/>
jQuery 代码:
$("img").attr("src");
test.jpg attr(properties)attr(properties)
将一个“名/值”形式的对象设置为所有匹配元素的属性。
这是一种在所有匹配元素中批量设置很多属性的最佳方式。 注意,如果你要设置对象的class属性,你必须使用'className' 作为属性名。或者你可以直接使用.addClass( class ) 和 .removeClass( class ).
--------------------------------------------------------------------------------
Set a key/value object as properties to all matched elements.
Th
is serves as
th
e best way to set a large number of properties on all matched elements. Note
th
at you must use 'className' as key if you want to set
th
e class-Attribute. Or use .addClass( class ) or .removeClass( class ).
jQuery
properties (Map) : 作为属性的“名/值对”对象
为所有图像设置src和alt属性。
HTML 代码:
jQuery 代码:
$("img").attr({ src: "test.jpg", alt: "Test
Image
" });
[ <img src= "test.jpg" alt:="Test
Image
" /> ]
--------------------------------------------------------------------------------
attr(key,value)attr(key,value)
为所有匹配的元素设置一个属性值。
--------------------------------------------------------------------------------
Set a single property to a value, on all matched elements.
jQuery
key (String) : 属性名称
value (Object) : 属性值
为所有图像设置src属性。
HTML 代码:
jQuery 代码:
$("img").attr("src","test.jpg");
[ <img src= "test.jpg" /> , <img src= "test.jpg" /> ] attr(key,fn)attr(key,fn)
为所有匹配的元素设置一个计算的属性值。
不提供值,而是提供一个
函数
,由这个
函数
计算的值作为属性值。
--------------------------------------------------------------------------------
Set a single property to a computed value, on all matched elements.
Instead of supplying a string value as described 'above', a
function
is provided
th
at computes
th
e value.
jQuery
key (String) : 属性名称
fn (
Function
) : 返回值的
函数
范围:当前元素, 参数: 当前元素的索引值
把src属性的值设置为title属性的值。
HTML 代码:
<img src="test.jpg"/>
jQuery 代码:
$("img").attr("title",
function
() { return
th
is.src });
<img src="test.jpg" title="test.jpg" /> removeAttr(name)removeAttr(name)
从每一个匹配的元素中删除一个属性
--------------------------------------------------------------------------------
Remove an attribute from each of
th
e matched elements.
jQuery
name (String) : 要删除的属性名
将文档中图像的src属性删除
HTML 代码:
<img src="test.jpg"/>
jQuery 代码:
$("img").removeAttr("src");
[ <img /> ] 类
addClass(class)addClass(class)
为每个匹配的元素添加指定的类名。
--------------------------------------------------------------------------------
Adds
th
e specified class(es) to each of
th
e set of matched elements.
jQuery
class (String) : 一个或多个要添加到元素中的CSS类名,请用空格分开
为匹配的元素加上 '
select
ed' 类
HTML 代码:
<p>Hello</p>
jQuery 代码:
$("p").addClass("
select
ed");
[ <p class="
select
ed">Hello</p> ]
--------------------------------------------------------------------------------
为匹配的元素加上
select
ed highlight 类
HTML 代码:
<p>Hello</p>
jQuery 代码:
$("p").addClass("
select
ed highlight");
[ <p class="
select
ed highlight">Hello</p> ] removeClass(class)removeClass(class)
从所有匹配的元素中删除全部或者指定的类。
--------------------------------------------------------------------------------
Removes all or
th
e specified class(es) from
th
e set of matched elements.
jQuery
class (String) : (可选) 一个或多个要删除的CSS类名,请用空格分开
从匹配的元素中删除 '
select
ed' 类
HTML 代码:
<p class="
select
ed first">Hello</p>
jQuery 代码:
$("p").removeClass("
select
ed");
[ <p>Hello</p> ]
--------------------------------------------------------------------------------
删除匹配元素的所有类
HTML 代码:
<p class="
select
ed first">Hello</p>
jQuery 代码:
$("p").removeClass();
[ <p>Hello</p> ] toggleClass(class)toggleClass(class)
如果存在(不存在)就删除(添加)一个类。
--------------------------------------------------------------------------------
Adds
th
e specified class if it is not present, removes
th
e specified class if it is present.
jQuery
class (String) :CSS类名
为匹配的元素切换 '
select
ed' 类
HTML 代码:
<p>Hello</p><p class="
select
ed">Hello Again</p>
jQuery 代码:
$("p").toggleClass("
select
ed");
[ <p class="
select
ed">Hello</p>, <p>Hello Again</p> ] Html代码
html()html()
取得第一个匹配元素的html内容。这个
函数
不能用于XML文档。但可以用于XHTML文档。
--------------------------------------------------------------------------------
Get
th
e html contents of
th
e first matched element.
Th
is property is not available on XML documents (al
th
ough it will work for XHTML documents).
String
HTML 代码:
<div><p>Hello</p></div>
jQuery 代码:
$("div").html();
Hello html(val)html(val)
设置每一个匹配元素的html内容。这个
函数
不能用于XML文档。但可以用于XHTML文档。
--------------------------------------------------------------------------------
Set
th
e html contents of every matched element.
Th
is property is not available on XML documents (al
th
ough it will work for XHTML documents).
jQuery
val (String) : 用于设定HTML内容的值
HTML 代码:
<div></div>
jQuery 代码:
$("div").html("<p>Hello Again</p>");
[ <div><p>Hello Again</p></div> ] 文本
text()text()
取得所有匹配元素的内容。
结果是由所有匹配元素包含的文本内容组合起来的文本。这个方法对HTML和XML文档都有效。
--------------------------------------------------------------------------------
Get
th
e text contents of all matched elements.
Th
e result is a string
th
at contains
th
e combined text contents of all matched elements.
Th
is me
th
od works on bo
th
HTML and XML documents.
String
HTML 代码:
<p><b>Test</b> Paragraph.</p><p>Paraparagraph</p>
jQuery 代码:
$("p").text();
Test Paragraph.Paraparagraph text(val)text(val)
设置所有匹配元素的文本内容
与 html() 类似, 但将编码 HTML (将 "<" 和 ">" 替换成相应的HTML实体).
--------------------------------------------------------------------------------
Set
th
e text contents of all matched elements.
Similar to html(), but escapes HTML (replace "<" and ">" wi
th
th
eir HTML entities).
jQuery
val (String) : 用于设置元素内容的文本
HTML 代码:
<p>Test Paragraph.</p>
jQuery 代码:
$("p").text("<b>Some</b> new text.");
[ <p><b>Some</b> new text.</p> ] 值
val()val()
获得第一个匹配元素的当前值。
在 jQuery 1.2 中,可以返回任意元素的值了。包括
select
。如果多选,将返回一个数组,其包含所选的值。
--------------------------------------------------------------------------------
Get
th
e content of
th
e value attribute of
th
e first matched element.
In jQuery 1.2, a value is now returned for all elements, including
select
s. For multiple
select
s an array of values is returned.
String,Array
获得单个
select
的值和多选
select
的值。
HTML 代码:
<p></p><br/>
<
select
id="single">
<option>Single</option>
<option>Single2</option>
</
select
>
<
select
id="multiple" multiple="multiple">
<option
select
ed="
select
ed">Multiple</option>
<option>Multiple2</option>
<option
select
ed="
select
ed">Multiple3</option>
</
select
>
jQuery 代码:
$("p").append(
"<b>Single:</b> " + $("#single").val() +
" <b>Multiple:</b> " + $("#multiple").val().join(", ")
[ <p><b>Single:</b>Single<b>Multiple:</b>Multiple, Multiple3</p>]
--------------------------------------------------------------------------------
获取文本框中的值
HTML 代码:
<input type="text" value="some text"/>
jQuery 代码:
$("input").val();
some text val(val)val(val)
设置每一个匹配元素的值。
在 jQuery 1.2, 这也可以为
select
元件赋值
--------------------------------------------------------------------------------
Set
th
e value attribute of every matched element.
In jQuery 1.2,
th
is is also able to set
th
e value of
select
elements, but
select
ing
th
e appropriate options.
jQuery
val (String) : 要设置的值。
设定文本框的值
HTML 代码:
<input type="text"/>
jQuery 代码:
$("input").val("hello world!"); val(val)val(val)
check,
select
,radio等都能使用为之赋值
jQuery
val (Array<String>) : 用于 check/
select
的值
设定一个
select
和一个多选的
select
的值
HTML 代码:
<
select
id="single">
<option>Single</option>
<option>Single2</option>
</
select
>
<
select
id="multiple" multiple="multiple">
<option
select
ed="
select
ed">Multiple</option>
<option>Multiple2</option>
<option
select
ed="
select
ed">Multiple3</option>
</
select
><br/>
<input type="checkbox" value="check1"/> check1
<input type="checkbox" value="check2"/> check2
<input type="radio" value="radio1"/> radio1
<input type="radio" value="radio2"/> radio2
jQuery 代码:
$("#single").val("Single2");
$("#multiple").val(["Multiple2", "Multiple3"]);
$("input").val(["check2", "radio1"]);
eq(index)eq(index)
获取第N个元素
这个元素的位置是从0算起。
--------------------------------------------------------------------------------
Reduce
th
e set of matched elements to a single element.
Th
e position of
th
e element in
th
e set of matched elements starts at 0 and goes to leng
th
- 1.
jQuery
index (Integer) :元素在jQuery对象中的索引
获取匹配的第二个元素
HTML 代码:
<p>
Th
is is just a test.</p> <p> So is
th
is</p>
jQuery 代码:
$("p").eq(1)
[ <p> So is
th
is</p> ] hasClass(class)hasClass(class)
检查当前的元素是否含有某个特定的类,如果有,则返回true。
这其实就是 is("." + class)。
--------------------------------------------------------------------------------
Checks
th
e current
select
ion against a class and returns true, if at least one element of
th
e
select
ion has
th
e given class.
Th
is is an alternative to is("." + class).
Boolean
class (String) : 用于匹配的类名
给包含有某个类的元素进行一个动画。
HTML 代码:
<div class="protected"></div><div></div>
jQuery 代码:
$("div").click(
function
(){
if ( $(
th
is).hasClass("protected") )
$(
th
is)
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: -10 })
.animate({ left: 10 })
.animate({ left: 0 });
}); filter(expr)filter(expr)
筛选出与指定表达式匹配的元素集合。
这个方法用于缩小匹配的范围。用逗号分隔多个表达式
--------------------------------------------------------------------------------
Removes all elements from
th
e set of matched elements
th
at do not match
th
e specified expression(s).
Th
is me
th
od is used to narrow down
th
e results of a s
ear
ch. Provide a comma-separated list of expressions to apply multiple filters at once.
jQuery
expr (Expression) : 表达式
保留带有
select
类的元素
HTML 代码:
<p>Hello</p><p>Hello Again</p><p class="
select
ed">And Again</p>
jQuery 代码:
$("p").filter(".
select
ed")
[ <p class="
select
ed">And Again</p> ]
--------------------------------------------------------------------------------
保留第一个以及带有
select
类的元素
HTML 代码:
<p>Hello</p><p>Hello Again</p><p class="
select
ed">And Again</p>
jQuery 代码:
$("p").filter(".
select
ed, :first")
[ <p>Hello</p>, <p class="
select
ed">And Again</p> ] filter(fn)filter(fn)
筛选出与指定
函数
返回值匹配的元素集合
这个
函数
内部将对每个对象计算一次 (正如 '$.each'). 如果调用的
函数
返回false则这个元素被删除,否则就会保留。
--------------------------------------------------------------------------------
Removes all elements from
th
e set of matched elements
th
at does not match
th
e specified
function
.
Th
e
function
is called wi
th
a context equal to
th
e current element (just like '$.each'). If
th
e
function
returns false,
th
en
th
e element is removed - any
th
ing else and
th
e element is kept.
jQuery
fn (
Function
) : 传递进filter的
函数
保留子元素中不含有ol的元素。
HTML 代码:
<p><ol><li>Hello</li></ol></p><p>How are you?</p>
jQuery 代码:
$("p").filter(
function
(index) {
return $("ol",
th
is).leng
th
== 0;
[ <p>How are you?</p> ] is(expr)is(expr)
用一个表达式来检查当前选择的元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true。
如果没有元素符合,或者表达式无效,都返回'false'. 'filter' 内部实际也是在调用这个
函数
,所以,filter()
函数
原有的规则在这里也适用。
--------------------------------------------------------------------------------
Checks
th
e current
select
ion against an expression and returns true, if at least one element of
th
e
select
ion fits
th
e given expression.
If no element fits, or
th
e expression is not valid,
th
en
th
e response will be 'false'. 'filter' is used internally,
th
erefore all rules
th
at apply
th
ere apply here, as well.
Boolean
expr (String) :用于筛选的表达式
由于input元素的父元素是一个表单元素,所以返回true。
HTML 代码:
<form><input type="checkbox" /></form>
jQuery 代码:
$("input[type='checkbox']").parent().is("form")
true map(callback)map(callback)
将一组元素转换成其他数组(不论是否是元素数组)
你可以用这个
函数
来建立一个列表,不论是值、属性还是CSS样式,或者其他特别形式。这都可以用'$.map()'来方便的建立。
--------------------------------------------------------------------------------
Translate a set of elements into ano
th
er set of values (which may, or may not, be elements).
You could use
th
is to build lists of values, attributes, css values - or even perform special, custom,
select
or transformations.
Th
is is provided as a convenience me
th
od for using '$.map()'.
jQuery
callback (
Function
) : 给每个元素执行的
函数
把form中的每
js中常见的错误,例如Uncaught TypeError: x is not a
function
其原因除了
函数
本身有错之外,还有一种很奇怪的情况:
函数
本身没有错,但是运行时就是不能正常运行。这种情况与javascript的特性有关:变量与
函数
声明前置的优先级。
首先看代码:
console.log(x)
console.log(x());
var x=1;
function
x(){...
Image
一级目录二级目录三级目录
Image
前言获取
影像
1、ee.
Image
导入单张
影像
2、Get an `ee.
Image
` from an `ee.
Image
Collection`3、
Image
s from Cloud GeoTIFFs
影像
的波段操作1、 ee.
Image
.cat() 融合两个波段2、
image
.
select
()修改波段的名称3、
image
.addBands() 添加波段
影像
的可视化介绍Map.addLayer()
RGB
颜色合成color 调色板掩膜三种掩膜
函数
介绍那么这三种淹没
函数
又
最近在使用Tdrag https://www.jq22.com/demo/Tdrag20160709/插件的时候 提示$(....)Tdrag is not a
function
解决方式是3
那么一般有哪几种问题会导致$(...).XXX is not a
function
这种错误提示呢:
1:请检查你调用的相对应的jquery插件文件路径是否正确。
2:请检查插件是否有对应的
函数
。
3:有的插件需要整个页面加载完毕才能正常运行。
这种情况需要将调用jquery插件文件的代码放在页面最后的&l.
Google
Ear
th
Engine
(
GEE
)是由谷歌、卡内基梅隆大学、美国地质调查局(USGS)共同开发的用以处理卫星遥感
影像
数据和其他地球观测数据的云端运算平台。
GEE
平台融合了谷歌服务器提供的强大计算能力或者以及大范围的云计算资源,平台数据集提供了对地观测卫星大量完整的
影像
数据如Sentinel, MODIS,Landsat等,也提供了植被、地表温度和社会经济等数...
Google
Ear
th
Engine
是
Google
提供的对大量全球尺度地球科学资料(尤其是卫星数据)进行在线可视化计算和分析处理的云平台。该平台能够存取卫星图像和其他地球观测数据数据库中的资料并足够的运算能力对这些数据进行处理。
通俗的来讲,就是
Google
ear
th
engine
可以在线对遥感数据(或其他地球资料)进行处理分析,而不用将数据下载到自己电脑上进行处理。我们只需要把最后的结果下载到自己电脑上就可以了。
如何访问
Google
ear
th
engine
Google
ear
th
engi
代码结构:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-
select
@1.13.14/dist/css/bootstrap-
select
.min.css">
Ear
th
Engine
不同于用于地理空间数据分析的传统图像处理、GIS 或其他桌面软件。您在
Ear
th
Engine
中创建的算法在
Google
云中运行,分布在多台计算机上。调试可能具有挑战性,因为错误可能发生在客户端 JavaScript 代码或编码指令的服务器端执行中,并且是由扩展问题以及语法或逻辑错误引起的。除非您要求,否则无法检查在云中某处运行的程序部分。本文档介绍了调试策略、工具和解决方案,以帮助您解决常见错误和调试
Ear
th
Engine
脚本。
官方给出的指南