js層級選擇框樣式（JS選擇框）

本文目錄一覽：

• 1、如何用JS選中下拉框選項
• 2、js層次選擇器div+one 這個+號代表什麼
• 3、jQuery層次選擇器用法示例
• 4、用js怎麼設置單元格的邊框
• 5、如何用js實現select下拉框里是樹形結構，可複選，select框中傳複選所有值？如下圖所示。
• 6、js如何設置excle表格邊框的樣式…

如何用JS選中下拉框選項

1、打開vscode，創建一個H5規範的頁面，用於演示js如何給下拉框設置默認值。

2、在頁面中添加一個下拉框，並在html中通過selected屬性，默認選擇下拉框的第2個值。

3、在瀏覽器中打開頁面，就可以看到這個下拉框默認選中的第二個下拉值。

4、在頁面頂部引入jquery，由於本文將jquery和頁面放在同一級目錄，所以，直接使用了jquery文件名引用。如果不在同一級目錄，引入的路徑需要有層級。

5、在頁面底部，添加jquery代碼，使用.val()方法，在頁面文檔載入後，就馬上修改下拉框的默認選中值為第三個值。此時是不管html的標籤中selected屬性原來是標記在哪一個選項的，都會改成新的值。

6、在瀏覽器中打開頁面，這個時候就會看到，下拉框的默認值已經變成了第三個選項。

7、如果想要通過下拉框的顯示值來設置默認選中項，就需要使用類似下面的語法：

$(“#sltDef”).find(“option:contains(‘第4個選項’)”).attr(“selected”, true);

js層次選擇器div+one 這個+號代表什麼

就是選擇緊接在div後面的類名為one的元素，用通俗的話來說就是選擇和你年齡最接近的那個弟弟。比如：

div這是年齡和你最接近的哥哥/div

div這是你/div

p class=one這是年齡和你最接近的弟弟，它會被div+.one選中/p

p class=one這是年齡更小的弟弟，它不會被選中/p

jQuery層次選擇器用法示例

本文實例講述了jQuery層次選擇器用法。分享給大家供大家參考，具體如下：

!DOCTYPE

html

PUBLIC

“-//W3C//DTD

XHTML

1.0

Transitional//EN”

“”

html

xmlns=””

head

meta

http-equiv=”Content-Type”

content=”text/html;

charset=utf-8″

/

title2-5/title

!–

引入jQuery

—

script

src=”js/jquery-1.10.1.min.js”

type=”text/javascript”/script

script

src=”js/assist.js”

type=”text/javascript”/script

link

rel=”stylesheet”

type=”text/css”

href=”css/style.css”

/

script

type=”text/javascript”

$(document).ready(function(){

//選擇

body內的所有div元素.

$(‘#btn1’).click(function(){

$(‘body

div’).css(“background”,”#bbffaa”);

})

//在body內的選擇

元素名是div

的子元素.

$(‘#btn2’).click(function(){

$(‘body

div’).css(“background”,”#bbffaa”);

})

//選擇

所有class為one

的下一個div元素.

$(‘#btn3’).click(function(){

$(‘.one

+

div’).css(“background”,”#bbffaa”);

})

//選擇

id為two的元素後面的所有div兄弟元素.

$(‘#btn4’).click(function(){

$(‘#two

~

div’).css(“background”,”#bbffaa”);

})

});

/script

/head

body

h3層次選擇器./h3

button

id=”reset”手動重置頁面元素/button

input

type=”checkbox”

id=”isreset”

checked=”checked”/

label

for=”isreset”點擊下列按鈕時先自動重置頁面/label

br

/

br

/

input

type=”button”

value=”選擇

body內的所有div元素.”

id=”btn1″/

input

type=”button”

value=”在body內,選擇子元素是div的。”

id=”btn2″/

input

type=”button”

value=”選擇

所有class為one

的下一個div元素.”

id=”btn3″/

input

type=”button”

value=”選擇

id為two的元素後面的所有div兄弟元素.”

id=”btn4″/

br

/

br

/

!–

測試的元素

—

div

class=”one”

id=”one”

id為one,class為one的div

div

class=”mini”class為mini/div

/div

div

class=”one”

id=”two”

title=”test”

id為two,class為one,title為test的div.

div

class=”mini”

title=”other”class為mini,title為other/div

div

class=”mini”

title=”test”class為mini,title為test/div

/div

div

class=”one”

div

class=”mini”class為mini/div

div

class=”mini”class為mini/div

div

class=”mini”class為mini/div

div

class=”mini”/div

/div

div

class=”one”

div

class=”mini”class為mini/div

div

class=”mini”class為mini/div

div

class=”mini”class為mini/div

div

class=”mini”

title=”tesst”class為mini,title為tesst/div

/div

div

style=”display:none;”

class=”none”style的display為”none”的div/div

div

class=”hide”class為”hide”的div/div

div

包含input的type為”hidden”的div

input

type=”hidden”

size=”8″/

/div

span

id=”mover”正在執行動畫的span元素./span

/body

/html

效果圖：

更多關於jQuery相關內容感興趣的讀者可查看本站專題：《jquery選擇器用法總結》、《jQuery操作DOM節點方法總結》、《jQuery頁面元素操作技巧匯總》、《jQuery常見事件用法與技巧總結》、《jQuery常用插件及用法總結》、《jQuery擴展技巧總結》、《jQuery表格(table)操作技巧匯總》及《jQuery常見經典特效匯總》

希望本文所述對大家jQuery程序設計有所幫助。

用js怎麼設置單元格的邊框

直接換是不可以的

關於單元格的線形還是顏色，這些都是先選擇線的粗細然後再加邊框，(必須有個去邊框的過程不然直接修改是不可以的)

具體過程如下

單元你想要改的單元格 右鍵 設置單元格格式 邊框 然後你點一下無邊框那個 然後選擇線的樣式或者粗細 然後點外邊框 這樣就可以了

希望能幫助到你

如何用js實現select下拉框里是樹形結構，可複選，select框中傳複選所有值？如下圖所示。

首先說樹形結構，國內有個開源的js控制項叫zTree，支持複選。

然後下拉框你可能需要自己做一個（html輸入框+右邊的一個圖標按鈕）。

最後，用一個隱藏的div把樹形結構包起來，這個div設置成絕對定位，在下拉框右側選擇按鈕的單擊事件處理函數里，顯示這個隱藏的div，並把它的位置設置成在下拉框下面就行了。

思路就是這樣，要麼樓主可以找找有沒有其他更現成的控制項，extjs4我記得有類似的，但是他的複選功能不太符合中國習慣，也許現在的版本改好了，你可以查查試試看。

js如何設置excle表格邊框的樣式…

請嘗試 oXL.Selection.Borders.Weight = 2; 來設置邊框, 1表示最細邊框,2表示細邊框,4表示粗線。

對於更粗的,可以嘗試通過 oXL.Selection.Borders.LineStyle = 1;來表示,具體線型: 1 實線, -4115 虛線, 4 點劃相間線, 5 劃線後跟兩個點, -4118 點式線, -4119 雙線。

以上信息是根據excel自帶的vb文檔找到的,VB下測試正常, 沒有在JS下測試.