2016-11-27

eq(index|-index)

概述

獲取當前鏈式操作中第N個jQuery對象胖眷,返回jQuery對象涩惑,當參數(shù)大于等于0時為正向選取藏杖,比如0代表第一個,1代表第二個脉顿。當參數(shù)為負數(shù)時為反向選取蝌麸,比如-1為倒數(shù)第一個,具體可以看以下示例艾疟。
類似的有g(shù)et(index),不過get(index)返回的是DOM對象来吩。

參數(shù)

index IntegerV1.1.2

一個整數(shù),指示元素基于0的位置,這個元素的位置是從0算起蔽莱。

-index IntegerV1.4

一個整數(shù)弟疆,指示元素的位置,從集合中的最后一個元素開始倒數(shù)盗冷。(-1算起)

示例

參數(shù)index描述:

獲取匹配的第二個元素

HTML 代碼:

<p> This is just a test.</p> <p> So is this</p>

jQuery 代碼:

$("p").eq(1)

結(jié)果:

[ <p> So is this</p> ]

參數(shù)-index描述:

獲取匹配的第二個元素

HTML 代碼:

<p> This is just a test.</p> <p> So is this</p>

jQuery 代碼:

$("p").eq(-2)

結(jié)果:

[ <p> This is just a test.</p> ]

siblings([expr])

概述

取得一個包含匹配的元素集合中每一個元素的所有唯一同輩元素的元素集合怠苔。可以用可選的表達式進行篩選仪糖。
參數(shù)

expr String V1.0

用于篩選同輩元素的表達式

示例

描述:

找到每個div的所有同輩元素柑司。

HTML 代碼:

<p>Hello</p><div><span>Hello Again</span></div><p>And Again</p>

jQuery 代碼:

$("div").siblings()

結(jié)果:

[ <p>Hello</p>, <p>And Again</p> ]

描述:

找到每個div的所有同輩元素中帶有類名為selected的元素。

HTML 代碼:

<div><span>Hello</span></div><p class="selected">Hello Again</p><p>And Again</p>

jQuery 代碼:

$("div").siblings(".selected")

結(jié)果:

[ <p class="selected">Hello Again</p> ]

attr(name|properties|key,value|fn)

概述

設(shè)置或返回被選元素的屬性值锅劝。

參數(shù)

name String V1.0

屬性名稱

properties Map V1.0

作為屬性的“名/值對”對象

key, valueString, Object V1.0

屬性名稱攒驰,屬性值

key, function(index, attr)String, Function V1.1

1:屬性名稱。

2:返回屬性值的函數(shù),第一個參數(shù)為當前元素的索引值鸠天,第二個參數(shù)為原先的屬性值讼育。

示例

參數(shù)name 描述:

返回文檔中所有圖像的src屬性值。

jQuery 代碼:

$("img").attr("src");

參數(shù)properties 描述:

為所有圖像設(shè)置src和alt屬性稠集。

jQuery 代碼:

$("img").attr({ src: "test.jpg", alt: "Test Image" });

參數(shù)key,value 描述:

為所有圖像設(shè)置src屬性奶段。

jQuery 代碼:

$("img").attr("src","test.jpg");

參數(shù)key,回調(diào)函數(shù) 描述:

把src屬性的值設(shè)置為title屬性的值。

jQuery 代碼:

$("img").attr("title", function() { return this.src });

JavaScript unescape() 函數(shù)

JavaScript 全局對象

定義和用法

unescape() 函數(shù)可對通過 escape() 編碼的字符串進行解碼剥纷。

語法

unescape(string)

參數(shù) 描述

string 必需痹籍。要解碼或反轉(zhuǎn)義的字符串。

返回值

string 被解碼后的一個副本晦鞋。

說明

該函數(shù)的工作原理是這樣的:通過找到形式為 %xx 和 %uxxxx 的字符序列(x 表示十六進制的數(shù)字)蹲缠,用 Unicode 字符 \u00xx 和 \uxxxx 替換這樣的字符序列進行解碼。

提示和注釋

注釋:
ECMAScript v3 已從標準中刪除了 unescape() 函數(shù)悠垛,并反對使用它线定,因此應(yīng)該用 decodeURI() 和 decodeURIComponent() 取而代之。

實例

在本例中确买,我們將使用 escape() 來編碼字符串斤讥,然后使用 unescape() 對其解碼:

<script type="text/javascript">

var test1="Visit W3School!"

test1=escape(test1)
document.write (test1 + "<br />")

test1=unescape(test1)
document.write(test1 + "<br />")

</script>

輸出:

Visit%20W3School%21

Visit W3School!

HTML DOM protocol 屬性

HTML DOM Location 對象

定義和用法

protocol 屬性是一個可讀可寫的字符串,可設(shè)置或返回當前 URL 的協(xié)議湾趾。

語法

location.protocol=path

實例

假設(shè)當前的 URL 是: http://example.com:1234/test.htm#part2

<html>
<body>

<script type="text/javascript">
document.write(location.protocol);
</script>

</body>
</html>

輸出:

http:

最后一種方法是深度定制bootstrap less

首先獲得bootstrap的源碼芭商,

打開源碼派草,你會發(fā)現(xiàn)Bootstrap的樣式是用LESS而不是CSS寫的。LESS 是一種動態(tài)樣式表語言铛楣,相比于CSS近迁,它支持多種優(yōu)秀特性,包括選擇器嵌套簸州,創(chuàng)建變量(就像在上面生成器中使用的)鉴竭。一旦寫完,你可以選擇將LESS代碼預(yù)先或在運行時編譯成 CSS岸浑。如果你喜歡 Sass拓瞪,可以使用這個適用于Sass的Bootstrap。

在 less 文件夾中助琐,你會看到許多按照組件來劃分的 LESS 文件。

實際上面氓,bootstrap是通過編譯bootstrap.less這一個文件而生成整個bootstrap.css文件的兵钮。我們看到bootstrap.less的作用僅僅是引入其他文件。這樣舌界,我們定制化的工作就好辦了掘譬。

以下這些文件是你要注意的:

bootstrap.less:

這個是核心文件。它用來引入其他文件呻拌,最終由你來編譯它葱轩。

reset.less:

始終是最先引入的文件。

variables.less 和 mixins.less:

這兩個文件總是同時出現(xiàn)藐握,因為其他文件都依賴于它們靴拱。前一個文件包含了在生成器網(wǎng)站上使用的相同的變量。

utilities.less

這個文件總是最后引入猾普,你可以把想要覆蓋的類寫到這里袜炕。

我們定制的思路就是,找到我們需要定制的組件和相對應(yīng)的變量初家,對其修改偎窘,然后編譯成我們自己的bootstrap.css即可。

下面講講具體實現(xiàn)方法溜在。

確保你已經(jīng)安裝好Less, 為了不讓我們修改的內(nèi)容與原始文件重合在一起陌知,我們需要模塊化的修改。

首先下載bootstrap源碼掖肋,下載后就不需要對其做任何的改動了仆葡。我們單獨建立一個文件夾(文件目錄只要能引用到bootstrap的less文件就可以),取名為custom-bootstrap培遵,其中包含以下三個文件:

custom-variables.less:

這個文件包含你要定制的變量浙芙。

custom-other.less:

這個文件中包含了那些無法通過修改變量完成定制的內(nèi)容登刺,比如增加或禁用button的text-shandow屬性。

custom-bootstrap.less

這是新的「核心」文件嗡呼。我們將把它編譯成CSS纸俭。與原始的 LESS文件一樣,它使用下面的命令來引入上面那兩個自定義文件(記住要保證文件正確的引用順序)

@import "../bootstrap/less/bootstrap.less"; //這個引用到原有的bootstrap文件
@import "custom-variables.less"; 
@import "custom-other.less";   
@import "../bootstrap/less/utilities.less"; //我們同樣要引用原生的utilities.less南窗,因為我們要保證該文件始終最后一個被導(dǎo)入

這時揍很,我們只要編譯custom-bootstrap.less就可以了。

有一些需要注意的是万伤,custom-variables.less 不需要拷貝原有文件的所有內(nèi)容窒悔,只需要拷貝和你要定制的組件相關(guān)的變量就可以了,如果你這樣做了敌买,單獨編譯custom-variables.less或custom-other.less會提示缺少變量定義的錯誤简珠,但這沒關(guān)系,你只要保證編譯custom-bootstrap.less沒有錯誤就可以了虹钮。

這種方法的優(yōu)點在于聋庵,將定制的變化與原有庫代碼很好的隔離,卻又不失可維護性芙粱。即使今后升級bootstrap版本祭玉,我們也不要擔心重新構(gòu)建樣式框架了。

寫于最后:
如何更高效的定制bootstrap還有一點需要注意的就是春畔,你要理解bootstrap組織代碼的方式以及如果更高效的書寫Less脱货。

jQuery.extend([deep], target, object1, [objectN])

概述

用一個或多個其他對象來擴展一個對象,返回被擴展的對象律姨。

如果不指定target振峻,則給jQuery命名空間本身進行擴展。這有助于插件作者為jQuery增加新方法线召。 如果第一個參數(shù)設(shè)置為true铺韧,則jQuery返回一個深層次的副本,遞歸地復(fù)制找到的任何對象缓淹。否則的話哈打,副本會與原對象共享結(jié)構(gòu)。 未定義的屬性將不會被復(fù)制讯壶,然而從對象的原型繼承的屬性將會被復(fù)制料仗。
參數(shù)

target,[object1],[objectN] Object,Object,Object V1.0

target:一個對象,如果附加的對象被傳遞給這個方法將那么它將接收新的屬性伏蚊,如果它是唯一的參數(shù)將擴展jQuery的命名空間立轧。

object1:待合并到第一個對象的對象斑粱。

objectN:待合并到第一個對象的對象煤傍。

[deep],target,object1,[objectN] Object,Object,Object,Object V1.1.4

deep:如果設(shè)為true,則遞歸合并。

target:待修改對象娜庇。

object1:待合并到第一個對象的對象俭厚。

objectN:待合并到第一個對象的對象丧靡。

示例

描述:

合并 settings 和 options综膀,修改并返回 settings。

jQuery 代碼:

var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);

結(jié)果:

settings == { validate: true, limit: 5, name: "bar" }

描述:

合并 defaults 和 options, 不修改 defaults葛躏。

jQuery 代碼:

var empty = {};
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = jQuery.extend(empty, defaults, options);

結(jié)果:

settings == { validate: true, limit: 5, name: "bar" }
empty == { validate: true, limit: 5, name: "bar" }
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末澈段,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子舰攒,更是在濱河造成了極大的恐慌败富,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,029評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件摩窃,死亡現(xiàn)場離奇詭異兽叮,居然都是意外死亡,警方通過查閱死者的電腦和手機猾愿,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,395評論 3 385
  • 文/潘曉璐 我一進店門充择,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人匪蟀,你說我怎么就攤上這事≡咨” “怎么了材彪?”我有些...
    開封第一講書人閱讀 157,570評論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長琴儿。 經(jīng)常有香客問我段化,道長,這世上最難降的妖魔是什么造成? 我笑而不...
    開封第一講書人閱讀 56,535評論 1 284
  • 正文 為了忘掉前任显熏,我火速辦了婚禮,結(jié)果婚禮上晒屎,老公的妹妹穿的比我還像新娘喘蟆。我一直安慰自己,他們只是感情好鼓鲁,可當我...
    茶點故事閱讀 65,650評論 6 386
  • 文/花漫 我一把揭開白布蕴轨。 她就那樣靜靜地躺著,像睡著了一般骇吭。 火紅的嫁衣襯著肌膚如雪橙弱。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,850評論 1 290
  • 那天,我揣著相機與錄音棘脐,去河邊找鬼斜筐。 笑死,一個胖子當著我的面吹牛蛀缝,可吹牛的內(nèi)容都是我干的顷链。 我是一名探鬼主播,決...
    沈念sama閱讀 39,006評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼内斯,長吁一口氣:“原來是場噩夢啊……” “哼蕴潦!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起俘闯,我...
    開封第一講書人閱讀 37,747評論 0 268
  • 序言:老撾萬榮一對情侶失蹤潭苞,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后真朗,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體此疹,經(jīng)...
    沈念sama閱讀 44,207評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,536評論 2 327
  • 正文 我和宋清朗相戀三年遮婶,在試婚紗的時候發(fā)現(xiàn)自己被綠了蝗碎。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,683評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡旗扑,死狀恐怖蹦骑,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情臀防,我是刑警寧澤眠菇,帶...
    沈念sama閱讀 34,342評論 4 330
  • 正文 年R本政府宣布,位于F島的核電站袱衷,受9級特大地震影響捎废,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜致燥,卻給世界環(huán)境...
    茶點故事閱讀 39,964評論 3 315
  • 文/蒙蒙 一登疗、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧嫌蚤,春花似錦辐益、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,772評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至急凰,卻和暖如春女仰,著一層夾襖步出監(jiān)牢的瞬間猜年,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,004評論 1 266
  • 我被黑心中介騙來泰國打工疾忍, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留乔外,地道東北人。 一個月前我還...
    沈念sama閱讀 46,401評論 2 360
  • 正文 我出身青樓一罩,卻偏偏與公主長得像杨幼,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子聂渊,可洞房花燭夜當晚...
    茶點故事閱讀 43,566評論 2 349

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理差购,服務(wù)發(fā)現(xiàn),斷路器汉嗽,智...
    卡卡羅2017閱讀 134,633評論 18 139
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案欲逃? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽?zāi)J的外補...
    _Yfling閱讀 13,737評論 1 92
  • 在線閱讀 http://interview.poetries.top[http://interview.poetr...
    程序員poetry閱讀 114,315評論 24 450
  • 身世平順畫如人, 工筆花卉功夫深饼暑。 繪鳥呆病欠靈動稳析, 了無八大潑墨韻。 又: 坦途人生少波瀾弓叛, 不信君從畫中觀彰居。 ...
    無影樹閱讀 291評論 1 1
  • 【7月30日】 更新 7月31日清退 20人,主要為入群未堅持或從未打卡者撰筷;若愿意8月1日 重新開始學(xué)習(xí)陈惰,請私信說...
    mytest閱讀 1,670評論 2 0