码迷,mamicode.com
首页 > Web开发 > 详细

jquery常用

时间:2019-05-02 00:32:26      阅读:181      评论:0      收藏:0      [点我收藏+]

标签:empty   idt   inpu   anim   cti   query   回调函数   move   linear   

$基本语法

  • .eq() 从0开始记
  • .eq($(this).index())
  • .addClass("active")
  • .removeClass("active")
  • .children()
  • .children().eq(2) 第三个孩子
  • .parent()
  • .siblings()
  • .attr("class","active")
  • .attr({
    class:"active",
    type:"text",
    aa:"bb"
    "big-name":linzixian //有 - 则加引号,防止被解析成减号
    }) 设置多个属性
  • .removeAttr()
  • .prop("checked","true") 布尔类型添加属性
  • .stop().animate({width:800},2000,linear,function(){})
  • .stop().slideDown() slideUp()
  • .stop().fadeIn() fadeOut() fadeToggle()
  • .css("color","blue")
  • .show(1000,function(){})
  • .hide()
  • .append("<p>哈哈</p>")
  • .prepend()
  • $("p").appendTo($("div"))
  • $("<tr><td>名字</td><td>性别</td></tr>").appendTo("tbody")给表格的tbody里添加一行
  • .text($("#txt").val())设置内容并传输到文本
  • $("#txt").val("哈哈") 设置内容
  • .html()
  • .text()
  • .val() 内容
  • $("text").val("") 清空text的内容
  • $("div").empty()
  • $("div").remove()
  • .focus() 焦点
  • .blur()
  • .on("click",function(){})
  • .off("click") 移除事件绑定
  • .delay(2000)
  • .prev()
  • .next()
  • .prevAll()
  • .nextAll()
.html() .text() .val()以及$(" ")的差异总结:
  • .html() .text() .val()三种方法都是用来读取选定元素的内容;
  • .html()是用来读取元素的html内容(包括html标签);
  • .text()用来读取元素的纯文本内容,包括其后代元素;
  • .val()是用来读取表单元素的"value"值,常用于input上;
  • $("<h3>hello</h3>").appendTo("#username")设置内容并添加到id="username"的标签中
  • .html().text()方法不能使用在表单元素上,而.val()只能使用在表单元素上;
  • .html()方法使用在元素集合上时,只读取第一个元素;.val()方法和.html()相同,如果其应用在元素集合上时,只能读取第一个表单元素的"value"值,但是.text()不一样,如果.text()应用在多个元素上时,将会读取所有选中元素的文本内容;
  • .html(htmlString) .text(textString).val(value)三种方法都是用来替换选中元素的内容,如果三个方法同时运用在多个元素上时,那么将会替换所有选中元素的内容;
`$("<span><span>").text($("input").val())` 解析
1先通过 `$(" ")` 方法设置<span></span>盒子,
2再用 `$("input").val()` 方法将input文本框里的数据读取出来,
3再用 `.text()` 方法写入到span标签里

`$(input).val("")` 设置input文本框里的数据为空
  • .html(),.text(),.val()都可以使用回调函数的返回值来动态的改变多个元素的内容;

jquery常用

标签:empty   idt   inpu   anim   cti   query   回调函数   move   linear   

原文地址:https://www.cnblogs.com/huihuihero/p/10801054.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!