博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
js和jquery的基本应用
阅读量:4699 次
发布时间:2019-06-09

本文共 1707 字,大约阅读时间需要 5 分钟。

定义:

  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代表具体值                 })

转载于:https://www.cnblogs.com/xu1115/p/10916406.html

你可能感兴趣的文章
kafka中的消费组
查看>>
python--注释
查看>>
SQL case when else
查看>>
SYS_CONTEXT 详细用法
查看>>
Pycharm配置autopep8让Python代码更符合pep8规范
查看>>
我的第一篇博客
查看>>
【C++算法与数据结构学习笔记------单链表实现多项式】
查看>>
C#垃圾回收机制
查看>>
31、任务三十一——表单联动
查看>>
python之hasattr、getattr和setattr函数
查看>>
maven使用阿里镜像配置文件
查看>>
Copy code from eclipse to word, save syntax.
查看>>
arguments.callee的作用及替换方案
查看>>
P2709 小B的询问
查看>>
PHP echo 和 print 语句
查看>>
第一讲 一个简单的Qt程序分析
查看>>
Centos 6.5下的OPENJDK卸载和SUN的JDK安装、环境变量配置
查看>>
poj 1979 Red and Black(dfs)
查看>>
【.Net基础03】HttpWebRequest模拟浏览器登陆
查看>>
zTree async 动态参数处理
查看>>