JQuery与HTML元素的获取、设置、添加、删除

1.JQuery

    JQuery是JavaScript的一种封装库。  

  

    JavaScript从根本上讲，是获取HTML页面的元素，然后针对该元素不同的状态做出不同的事件反映。所以通过

JQuery你可以获取选定的HTML元素，然后对它进行操作。

    JQuery的语法很简单既：$(selector).action()。

    它的意思是JQuery【$】查询选取HTML元素【(selector)】执行xx操作【.action()】。$ 代表JQuery;selector

代表想要获取的元素；action代表想对这个元素进行什么样的函数操作。

    例如：$("#test").hide()。

    表示：对HTML页面中，ID=test的元素进行隐藏处理。

2.JQuery如何获取HTML元素

  分为两步：筛选元素和显示/设置元素。

  筛选元素：

  从上得知，JQuery获取HTML的元素需要对HTML页面元素进行筛选和定位：

  例如：

  $("span")                获取HTML中全部span元素  

            

  $("#elem")               获取HTML中ID为elem的元素

  $(".classname")          获取HTML中类为classname的元素

  $("ul li a.menu")        获取HTML中类为menu且嵌套在ul的li中的元素

  $("p>span")              获取HTML中p的直接子元素为span的p元素

  $("input[type=password]")获取HTML中输出类型为password的文本元素

  $("p:even")              获取HTML中全部为偶数的p段落

  显示/设置元素：

  显示元素的形式有三个既：text（）、HTML（）、val（）。

  text() - 设置或返回所选元素的文本内容。

  html() - 设置或返回所选元素的内容（包括 HTML 标记）。

  val () - 设置或返回表单字段的值。

  例如：

  $("span").text()        获取HTML中span标签的文本内容。

  $("span").text("你好")将HTML中span 标签的元素值设置为“你好”。

3.JQuery向HTML中插入

  方法：

  append（）---在选中元素结尾插入内容

  prepend() ---在选中元素开头插入内容

  after（） ---在选中元素的后面插入内容

  before（）---在选中元素的前面插入内容

  例：

  $("p").append("<p>新段落</p>")      在p标签的结尾处插入一个新的p标签内容为“新段落”。

4.JQuery删除HTML元素

  方法：

  remove（）---删除被选元素以及其下所有字节点元素。

  empty（） ---删除被选元素的所有子元素，保留备选元素。

  

  删除的使用方法和添加类似，就不举例子了。相信大家都能会。或者去参考w3c网的JQuery教程，里面更加详细。