锋利的jquery DOM操作

节点操作

插入节点

  var $li_1 = $("<li title="香蕉">香蕉</li>")  创建一个 li 节点  通过append加入到父节点中

删除节点

  remove()  删除节点的同时,删除绑定的事件

  detach()  删除节点,事件还在

  empty()  清空节点,节点还在

复制节点

  clone()

替换节点

  replaceWith()  参数替换调用者

  replaceAll()   反之

包裹节点

  $("strong").wrap("<b></b>")  strong标签用b标签包裹  所有匹配的元素单独包裹

  wrapAll()  用一个标签包裹

  wrapInner()  包裹内部元素

属性操作

设置属性

  $("p").attr("title" : "titlevalue", "title2" : "titlevalue2")  

删除属性

  $("p").removeAttr("title")

样式操作

  addClass()  追加样式

  removeClass()  移除样式  不带参数而移除所有class

  toggleClass()  重复切换class

  hasClass()  判断是否含有class

内容操作

  html()  获取元素内部的html代码

  text()  获取文本元素

  val()   获取设置value值

遍历节点

  children()  遍历子元素

  next()  获取紧跟着的下一个同辈节点

  prev()  获取上一个同辈节点

  siblings()  匹配元素前后的所有同辈元素  不包含自己

  closest()  取得最近的匹配元素

  parent()  返回匹配的父节点

  parents()  返回所有匹配的祖先节点

CSS DOM

  opacity  透明度

  offset()  

  position()

  

  

原文地址:https://www.cnblogs.com/amibandoufu/p/4977541.html