日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

jQuery与JS的区别,以及jQuery的基础语法

發布時間:2023/11/29 javascript 34 豆豆
生活随笔 收集整理的這篇文章主要介紹了 jQuery与JS的区别,以及jQuery的基础语法 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

*在使用jQuery時,要在頁面最上端加上

<script src="../jquery-1.11.2.min.js"></script>

?

看一下js與jQuery的區別:

JS是這樣使用的:

<script type="text/javascript">根據ID取元素,取到的是具體的元素var a = document.getElementById("p1");根據CLASS取var a = document.getElementsByClassName("aa");根據標簽名取var a = document.getElementsByTagName("div");根據name取var a = document.getElementsByName("cc"); alert(a); 操作元素操作內容非表單元素a.innerText = "hello";a.innerHTML = "<span style='color:red'>world</span>";表單元素a.value = "hello";操作屬性a.setAttribute("bs","1");a.getAttribute("bs");a.removeAttribute("bs");操作樣式a.style.color = red;    //只能獲取內聯屬性三個DIV隱藏var a = document.getElementsByClassName("aa");for(var i=0;i<a.length;i++){a[i].style.display = "none";}<script>

這是jQuery的使用方法():

<script type="text/javascript"> 根據ID找元素,取到的是JQUERY對象var b = $("#a1");根據CLASS取var b = $(".aa");根據標簽名取var b = $("div");根據屬性篩選var b = $("[name=aa]");操作元素操作內容非表單元素b.text();b.html();
賦值:
<div id="a1">11</div>
    var b = $("#a1");
    b.text("aaa")
    //b.html("aaa") 取值:var b = $("#a1");
   alert(b.text());
   //alert(b.html());
表單元素b.val();

賦值:
var b = $("#a1"); b.val("aaa")

取值: var b = $("#a1"); b.val();


操作屬性 b.attr("bs","1");
     b.attr(
"bs");
     b.removeAttr(
"bs");


操作樣式 alert(b.css(
"color"));
     b.css(
"font-size","50px");      //可以獲取、設置任意樣式


alert(b[
0]); 取jquery對象用eq()取元素本身用[]


隱藏三個元素 $(
".aa").css("display","none");


</script>

?

jQuery事件:掛事件、移除事件

<style type="text/css"> #a1{color:red} .aa{ width:100px; height:100px; background-color:#39F} </style> <div id="a1" style="width:100px; height:200px;">11</div><div class="aa" bs="1">aaaa</div> <div class="aa" bs="2">bbbbb</div> <div class="aa" bs="3">ccccc</div> <input type="text" id="p1" /> <input type="button" id="b1" value="掛事件" /> <input type="button" id="b2" value="移除事件" /> Jquery【加】事件頁面加載完成$(document).ready(function(e) {給a1加點擊$("#a1").click(function(){alert('aa');})給class為aa的所有元素加事件$(".aa").click(function(){alert($(this).attr("bs"));$(".aa").css("background-color","#39F");$(this).css("background-color","red");})第二種方式【掛】事件$("#b1").click(function(){$("#a1").bind("click",function(){alert("我是掛上的事件");});})$("#b2").click(function(){$("#a1").unbind("click");})});

?

轉載于:https://www.cnblogs.com/u1020641/p/6049608.html

創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的jQuery与JS的区别,以及jQuery的基础语法的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。