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

jquery的一些方法

时间:2018-01-13 12:55:40      阅读:135      评论:0      收藏:0      [点我收藏+]

标签:asc   pre   子节点   children   格式   创建   title   一个   父类   

# 注:jquery需要导包  格式<script type="text/javascript" src="jquery-3.2.1.js">></script>

1.读写节点html内容:

       node.html();  // 读取节点里的所有内容(文本和标签等信息);

     node.html( " " ); // 往该节点写入html内容,里面的内容会被覆盖。

     eg: $("p").html("修改后");

2.读写节点文本内容

     node.text();

     node.text(" ");  // 文本内容与html内容的区别在于文本内容只包含文本,没有其他html的元素(标签等)

3.增加节点: var p1=$( "<p>创建一个p节点</p>" );

4.插入节点:

             parent.append(p1); //将p1节点作为最后一个子节点插入;

            eg(例子):$("body").append(p1); 

            parent.prepend(p1); // 将p1节点作为第一个子节点插入;

           brother.afetr(p1); //作为弟弟(同级下一个)节点插入

           brother.afetr(p1); //作为哥哥(同级上一个)节点插入

5.删除节点:

          node.remove(); // 删除节点

         eg:$("p").remove();

        node.remove(选择器); //删除满足选择器的节点

        node.empty(); //删除节点的内容,但保留标签

6.样式操作

      node.addClass(" "); //追加样式,参数中传入一个类

     eg: $("p").addClass("size");

     node.removeClass(" "); //移除指定样式

    node.removeClass();  //移除所有样式

   toggleClass(" ");   //在设置和取消中切换

     hasClass(" ");   //判断是否有某个样式

    node.css("","").css("","") ;   //设置样式的值,可多个

7.遍历节点的操作

  parent.children() / parent.children(选择器):访问直接的子节点

       node.next(); // 访问下一个兄弟(同一个父类的同级元素)节点;

       node.prev(); //访问上一个兄弟节点

      node.sibling();// 访问所有的兄弟节点

      node.find();//  查找所有后代节点

      node.parent();  //查找父节点

    

    

 

 

 

 

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/html">
  .size{
 font-size:30px; 
}

</style>
</head> <body> <p>示范文本</p> <img src=""> </body> </html>

 

jquery的一些方法

标签:asc   pre   子节点   children   格式   创建   title   一个   父类   

原文地址:https://www.cnblogs.com/zhangzonghua/p/jquery.html

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