style: CSS樣式操作符

style()操作符用來(lái)設(shè)置或獲取選擇集中各DOM元素的CSS樣式：

1. selection.style(name[,value[,priority]])

style()操作符有三個(gè)參數(shù)：

• name: 樣式名稱(chēng)字符串，必須
• value：指定樣式新的值，可選
• priority：優(yōu)先級(jí)，可以是null或字符串"important"，可選

讀取樣式當(dāng)前值

如果沒(méi)有指定參數(shù)value，那么style()將返回選擇集中第一個(gè)DOM元素指定樣式的 計(jì)算值。請(qǐng)注意，這時(shí)只返回第一個(gè)元素的樣式！

為樣式設(shè)置新值

如果參數(shù)value是一個(gè)具體值，那么style()將選擇集中所有DOM元素的指定 樣式統(tǒng)一設(shè)置為該值。當(dāng)value為null值時(shí)，將清除該樣式值。

如果參數(shù)value是一個(gè)訪問(wèn)器函數(shù)，那么style()將依次對(duì)選擇集中的每一個(gè) DOM元素分別執(zhí)行該函數(shù)，并使用其返回值來(lái)設(shè)置當(dāng)前DOM元素指定樣式的值。

同時(shí)設(shè)定多個(gè)樣式

如果有多個(gè)樣式需要同時(shí)設(shè)置，可以直接傳入一個(gè)JSON對(duì)象：

1. selection.style({'stroke': 'black', 'stroke-width': 2})

attr: 屬性操作符

attr()操作符用來(lái)設(shè)置或獲取選擇集中各DOM元素的屬性：

1. selection.attr(name[,value])

attr()操作符有兩個(gè)參數(shù)：

• name：指定要操作的屬性名稱(chēng)，必須
• value：指明要為該屬性設(shè)置的新值或訪問(wèn)器函數(shù)，可選

讀取屬性當(dāng)前值

如果沒(méi)有指定參數(shù)value，那么attr()將返回選擇集中第一個(gè) DOM元素指定屬性的當(dāng)前值。

為屬性設(shè)置新值

參數(shù)value可以是一個(gè)具體值，這時(shí)attr()將選擇集中所有DOM元素的指定屬性值 統(tǒng)一設(shè)置為該值。

參數(shù)value也可以是一個(gè)訪問(wèn)器函數(shù)，這時(shí)attr()將依次對(duì)集合中的每一個(gè)元素 分別執(zhí)行該函數(shù)，并使用其返回值作為當(dāng)前處理DOM元素指定屬性的值。

html：html內(nèi)容操作符

html()操作符的實(shí)現(xiàn)基于DOM元素的innerHTML屬性，因此設(shè)置 這個(gè)值將完全替換選擇集中每一個(gè)DOM元素的全部?jī)?nèi)容：

1. selection.html([value])

參數(shù)value是可選的，用來(lái)替換當(dāng)前內(nèi)容。

讀取html內(nèi)容

如果沒(méi)有指定參數(shù)value，那么html()操作符將返回選擇集中第一個(gè) DOM元素的HTML內(nèi)容。

設(shè)置html內(nèi)容

如果參數(shù)value是一個(gè)具體值，那么html()操作符將選擇集中所有 DOM元素的HTML內(nèi)容統(tǒng)一設(shè)置為該值。

如果參數(shù)value是一個(gè)訪問(wèn)器函數(shù)，那么將依次對(duì)選擇集中的每一個(gè) DOM元素分別執(zhí)行該函數(shù)，并使用其返回值來(lái)設(shè)置當(dāng)前DOM元素的HTML內(nèi)容。

text：文本內(nèi)容操作符

text()操作符的實(shí)現(xiàn)基于DOM元素的textContent屬性，因此設(shè)置 這個(gè)值將完全替換選擇集中每一個(gè)DOM元素的全部?jī)?nèi)容：

1. selection.text([value])

參數(shù)value是可選的，用來(lái)替換當(dāng)前內(nèi)容。

讀取文本內(nèi)容

如果沒(méi)有指定參數(shù)value，那么text()操作符將返回選擇集中第一個(gè) DOM元素的文本內(nèi)容。

設(shè)置文本內(nèi)容

如果參數(shù)value是一個(gè)具體值，那么text()操作符將選擇集中所有 DOM元素的文本內(nèi)容統(tǒng)一設(shè)置為該值。

如果參數(shù)value是一個(gè)訪問(wèn)器函數(shù)，那么將依次對(duì)選擇集中的每一個(gè) DOM元素分別執(zhí)行該函數(shù)，并使用其返回值來(lái)設(shè)置當(dāng)前DOM元素的文本內(nèi)容。

append：追加操作符

append()操作符向選擇集中的每一個(gè)DOM元素追加一個(gè)子元素：

1. selection.append(name)

name參數(shù)可以是一個(gè)HTML標(biāo)簽名，這時(shí)append()將為選擇集中的每個(gè) DOM元素使用這個(gè)標(biāo)簽名創(chuàng)建新元素，并向當(dāng)前DOM對(duì)象追加該子元素。

name參數(shù)也可以是一個(gè)訪問(wèn)器函數(shù)，這時(shí)append()將為選擇集中 的每個(gè)DOM元素執(zhí)行這個(gè)函數(shù)，并將其返回的DOM對(duì)象追加為當(dāng)前DOM元素的子元素。

需要指出的是，append()返回的是一個(gè)不同的選擇集，其內(nèi)容是新追加的這些 DOM元素：

示例地址：http://www./course/54fd40cfe564e50d50dcf284/

insert：插入操作符

insert()操作符向選擇集中的每一個(gè)DOM元素，在指定子元素之前插入一個(gè)新元素：

1. selection.insert(name[,before])

和append()一樣，參數(shù)name可以是一個(gè)HTML標(biāo)簽名或者一個(gè) 訪問(wèn)器函數(shù)。位置參數(shù)before則使用與name同樣的方式 指定一個(gè)用來(lái)定位的子元素。

當(dāng)省略位置參數(shù)before時(shí)，新創(chuàng)建的元素將插入到最后，等效于append()。

同樣地，insert()返回的是一個(gè)不同的選擇集，其內(nèi)容是新插入的這些 DOM元素：

remove：刪除操作符

remove()方法將選擇集中的全部DOM元素從當(dāng)前文檔中移除：

1. selection.remove()

需要指出的是，remove()操作符并沒(méi)有銷(xiāo)毀這些移除的DOM元素，而僅僅是將 它們從當(dāng)前文檔中摘除，所返回的選擇集內(nèi)容沒(méi)有發(fā)生變化：

另外，當(dāng)前d3沒(méi)有提供專(zhuān)門(mén)的API將這些移除的DOM元素重新掛接到DOM樹(shù)上。如果你需要 這個(gè)功能，可以使用append()或insert()操作符。

參考資料：http://www./