定义:
jquery => js的dom操作进行封装,简化了js操作 //jquery就是把js封装成一个更简便的方法
jquery和js区别:找到元素,操作元素
只要看见 $ 符号就代表jquery,除非是自己定义了个方法
注意:想要用jquery方法,必须必须必须 先 引入jqeuy文件
找元素
js -> jquery js元素转化成jquery元素用 $( jsdom )
jquery -> js jquery元素转化成js元素用 $("button")[0] 或者 $("button") . get(0)js页面加载方法:
window.οnlοad=function(){ }
jquery页面加载方法一:
$(document).ready(function(){ })
jquery页面加载方法二:
$(function(){ })
操作内容
//js对象=> jsdom jquery对象=> jqdom
获取:jsdom . innerHTML 赋值:jsdom.innerHTML="这是要填的内容"; //innerHTML是给非表单元素填内容 获取:jsdom . value 赋值:jsdom.value="这是要填的内容"; //value是给表单元素填内容 获取:jqdom . html() 赋值:jqdom.html("这是要填的内容")//这里可以添加标签 //html()是给非表单元素填内容 获取:jqdom . val() 赋值:jqdom.val("这是要填的内容") //val()是给表单元素填内容 /*操作内容结束*/ /*操作样式*/ jsdom.style.color 获取:jqdom.css("color") 赋值方法一: jqdom.css("color","red") 赋值方法二:jqdom.css({ //json格式:大括号,内容赋值用:,每个用逗号隔开 "css":"red", "width":"120px", ... })操作属性
jsdom.setAttribute("class","c1") //js设置元素的属性
jsdom.getAttribute("class") //js获取元素属性 jsdom.removeAttribute("class") //js移除元素属性 jsdom.style.color //这个方法必须是非常清楚这个属性有的才可以用 获取:jqdom.attr("class") 赋值方法一:jqdom.attr("class","c1") 移除:jqdom.removeattr("class") 赋值方法二:jqdom.attr({ // json格式:大括号,内容赋值用:,每个用,隔开 "id":"btn", "class":"c1", ... }) jqdom.removeClass(classname) //移除jq对象样式 jqdom.addClass(classname) //给jq对象添加样式操作事件
jsdom.onClick=function(){
this //代表当前标签}jqdom.click(function(){ $(this) //这个this是js对象,必须用$转化成jquery,然后可以用jquery方法了})遍历
$("img").each(function(i,item){ //i代表下标,item代表具体值 })