JS和JQUERY的區別

2021-09-01 02:40:11 字數 1787 閱讀 2249

①.根據id取元素

js:取到的是乙個dom物件。

例:var div = document.getelementbyid("one");

jquery:取到的是乙個jquery物件。

例:var div = $("#one");——括號裡面是根據某個東西來找,相當於乙個選擇,如果我們要根據id來找,在樣式表裡的id是用#來表示的,所以在這裡我們直接帶入井號,整句的意思就是根據id為one的來查詢。

②.根據class取元素,在陣列裡面如果要取dom物件使用索引的方式,如果要取jquery物件使用eq()

js:取到的是乙個陣列

例:var div = document.elementsbyclassname("test");

jquery:

例:var div = $(".test");

③.根據name取元素

js:返回的是乙個陣列

例:var bd = document.getelementsbyname(uid);

jquery:的方式是用 方括號,屬性=乙個值,不限制非要根據name來取值,jquery是根據屬性來取元素

例:$("[name='uid']");

④.根據標籤名取元素

js:返回的也是乙個陣列

例:var div = document.getelementsbytagname("div");

jquery:和樣式表裡面給所有div加樣式的方法一樣,在雙引號內直接寫標籤名

例:$("div");

附:jquery的其他取值方式

組合選取:var div = $("div span");——有很多組合方式

操作內容

①.非表單元素(如果是文字就用text方法,如果是html**就用html方法)

例:div.text();——無引數的情況下是取值

div.text("aaaa");——有引數的情況下是賦值

div.html();——無引數的情況下是取值

div.html("aaaa");——有引數的情況下是賦值

②.表單元素

js:div.value;——取值;div.value = ***;——賦值

juqery:div.val();——無引數是取值,有引數是賦值。

操作屬性

js裡面用來操作屬性的方法是

div.setattribute("","");——設定屬性、修改屬性

div.removeattribute("");——移除屬性,引號裡面寫乙個屬性名

div.getattribute();——獲取屬性

jquery裡面用來操作屬性的方法

新增屬性:div.attr("test","aa");——給這個attr方法加入引數,屬性名叫做test,屬性的值是aa

移除屬性:div.removeattr("test");——移除test這條屬性

獲取屬性:div.attr("test");——在attr方法裡面直接寫入乙個屬性的名就可以了

操作樣式

js裡面操作樣式的關鍵字是style

例:div.style.backgroundcolor = "red";——把這個div的背景色設定成為了紅色

jquery裡面操作樣式的關鍵字是css

例:div.css("background-color","yellow");——把這個div的背景色變為黃色,在這裡css裡面所有的樣式和css樣式表裡面的樣式是一模一樣的沒有任何變化

js操作樣式的方法只能獲取內聯樣式,不能取內嵌的和外部的!!!!!

jquery操作樣式的方法可以是內聯的也可以是內嵌的

JS和JQUERY的區別

本文 根據id取元素 js 取到的是乙個dom物件。例 var div document.getelementbyid one jquery 取到的是乙個jquery物件。例 var div one 括號裡面是根據某個東西來找,相當於乙個選擇,如果我們要根據id來找,在樣式表裡的id是用 來表示的,...

JS和JQUERY的區別

js和jquery的區別 根據id取元素 js 取到的是乙個dom物件。例 var div document.getelementbyid one jquery 取到的是乙個jquery物件。例 var div one 括號裡面是根據某個東西來找,相當於乙個選擇,如果我們要根據id來找,在樣式表裡的...

JS和JQuery的區別

1,根據id取元素 js取到的是乙個dom物件,而jquery取到的是乙個jquery物件。例 var div one 2,根據class取元素 在陣列裡面如果要取dom物件使用索引的方式,如果要取jquery物件使用eq js 取到的是乙個陣列 var div document.elementsb...