1.jquery是什麼
乙個js的框架,可以方便的使用js
2 什麼是jquery物件
是由jquery封裝後的dom物件
注意:與dom物件的方法不同,不可以混用,但是可以相互轉換
3.基本語法:
jquery物件.方法()
4.得到jquery物件:
1)選擇器:
基本選擇器 $("*") $("#id") $(".class") $("element") $(".class,p,div")
層級選擇器 $(".outer div") $(".outer>div") $(".outer+div") $(".outer~div")
基本篩選器 $("li:first") $("li:eq(2)") $("li:even") $("li:gt(1)")
屬性選擇器 $('[id="div1"]') $('["alex="sb"][id]')
表單選擇器 $("[type='text']")----->$(":text") 注意只適用於input標籤
$("input:checked")
2)篩選器:
過濾篩選器
$("li").eq(2) $("li").first() $("ul li").hasclass("test")
查詢篩選器
$("div").children(".test") $("div").find(".test")
$(".test").next() $(".test").nextall() $(".test").nextuntil()
$("div").prev() $("div").prevall() $("div").prevuntil()
$(".test").parent() $(".test").parents() $(".test").parentuntil()
$("div").siblings()
補充:根據text進行選擇:
$(":contains('搜尋工具')")
5.操作:
屬性操作
$("p").text() $("p").html() $(":checkbox").val()
$(".test").attr("alex") $(".test").attr("alex","sb")
$(".test").attr("checked","checked") $(":checkbox").removeattr("checked")
$(".test").prop("checked",true)
$(".test").addclass("hide")
css操作
(樣式) css("")
(位置) offset() position() scrolltop() scrollleft()
(尺寸) height() width()
文件處理
prepend() prependto()
外部插入 before() insertbefore() after insertafter()
replacewith() remove() empty() clone()
eg:
remove: 移除
$("#cnblogs_post_body > p:nth-child(60) > span > span").remove()
[span, prevobject: init(1), context: document, selector: "#cnblogs_post_body > p:nth-child(60) > span > span"]
事件
$(document).ready(function(){}) -----------> $(function(){})
$("p").click(function(){})
$("p").bind("click",function(){})
$("ul").delegate("li","click",function(){})
動畫效果: 檢視
**函式:
$("p").hide(1000,function())
前端那些事
個人覺得前端著重點在於三個 效能 開發效率 安全 瀏覽器解釋和展示html檔案的方式是w3c規定的，w3c即全球資訊網聯盟，這個聯盟是現在國際上最權威的標準制定機構，意思就是w3c制定並維護html和css的規範，這些規範告訴瀏覽器如何解釋並顯示html檔案。瀏覽器的元件 1.使用者介面 2.瀏覽器...
幹前端的那些事
要知道，前端工程師的出現只在5年前，首先肯定這是乙個全新的職業，你不會沒有飯吃。說前端開發工程師是乙個全新的職位，是站在更多的以人為本的設計和開發的基礎上的，你的終極boss不是老闆，是人。如果你想吃好這碗飯，你會學習更多有用的相關方面的知識，這是必須的。原因很簡單，前端發展的很快，可能明年的今天你...
前端那些事 webpack 安裝
安裝 全域性安裝 npm install webpack webpack cli g專案安裝 npm install webpack webpack cli dnpx 命令 npm 5.2 解決問題 呼叫專案內部安裝的模組，原理就是node modules下的.bin目錄中找到對應的命令執行 web...