jQuery 常用的方法

时间：2022-01-13 05:14:31
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>品牌列表案例</title>
    <script src="js/jquery-2.1.1.min.js" rel="script"></script>
    <script>
        $(document).ready(function () {
            var $text =$("ul li:eq(2)"); //获取ul的第三个子节点
            var $text_v1 = $text.text();//获取指定元素的文本内容
            var $text_v2 = $("p").append("<b> world</b>");//向匹配的元素内部追加内容
            ($("<b>世界</b>").appendTo("p")); //向匹配的元素内部添加文本内容到末尾，
            $("a").prepend("<b>标签</b>");//在每一个匹配元素的文本前面添加指定内容
            $("<b>加在后面</b>").appendTo("a");//在每一个匹配元素的文本后面添加指定内容
            $("i").after("<b>内容加在倾斜文本之后</b>");//在匹配的元素之后添加文本内容
            //按照字面顺序来理解即可，就是将b标签内的内容添加到em标签的文本之后
            $("<b>的文本</b>").insertAfter("em");
            //添加到匹配元素的文本之前，因为div是块元素，所以添加的内容也是块元素
            $("div").before("<b>前面的文本</b>");
            //按照字面的反顺序来理解，也就是b标签文本添加到ol li:eq(1)元素文本的后面，不是前面
            $("<b>hello </b>").insertBefore($("ol li:eq(1)"));

            $("p").click(function(){
                //点击p标签文本时将p标签本身的文本复制（克隆）一次追加在em标签之后。
                $(this).clone().appendTo("em");
            });
                //将ol li:eq(2)元素的文本内容替换成指定的文本内容。
            $("ol li:eq(2)").replaceWith("<b>刘备</b>");
            $("em").wrap("<b></b>");//用b标签将em标签包裹起来

            alert($("strong").attr("title"));//获取匹配元素的属性的值
        })
    </script>
    </head>
<body>
   <ul>
       <li>demo1</li>
       <li>demo2</li>
       <li>demo3</li>
       <li>demo4</li>
       <li>demo5</li>
       <li>demo6</li>
   </ul>
<p>hello</p>
<a>box</a>
<a>title</a>
<a>test</a><br><br>
<i>倾斜文本</i><br><br>

<em>颠倒常理</em><br>
<div>hello</div>
<ol>
    <li>张三</li>
    <li>李四</li>
    <li>王二</li>
</ol>

<strong title="stronger">strong</strong>
</body>
</html>

jQuery 常用的方法的更多相关文章

  1. js与jquery常用数组方法总结

    昨天被问数组方法的时候,问到sort()方法是否会改变原来的数组.本来我猜是不会,也是这么说,马上我又觉得,知识这种东西,不确定的时候直接说不确定或不知道就好,只是凭借着不确定的猜测或者是记忆,害人害 ...

  2. jQuery 常用核心方法

    jQuery 常用核心方法 .each() 遍历一个jQuery对象,为每个匹配元素执行一个函数 $('p').each(function(idx,node){ $(node).text(idx + ...

  3. jQuery常用工具方法

    前面的话 jQuery提供一些与元素无关的工具方法,不必选中元素,就可以直接使用这些方法.如果理解原生javascript的继承原理,那么就能理解工具方法的实质.它是定义在jQuery构造函数上的方法 ...

  4. jQuery常用属性方法大全 attr&lpar;&rpar;&comma;val&lpar;&rpar;

    @@@@属性篇: 写作本篇文章的意义:jQuery的教程千千万,却没有英文版的API讲的系统.到位,一些话用中文翻译过来味道就变了,所以我将英文版的API的一些常用的方法单独提出来放在这里,并用自己的 ...

  5. Jquery常用的方法总结

    1.关于页面元素的引用通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom ...

  6. jquery 常用基础方法

    1 jquery常用方法: 2 取得标签元素里面内容与修改: 3 1.text()方法: 4 $(document).ready(function(){ 5 //alert("文档加载完毕& ...

  7. jQuery常用事件方法详解

    目录 jQuery事件 ready(fn)|$(function(){}) jQuery.on() jQuery.click jQuery.data() jQuery.submit() jQuery事 ...

  8. JQuery常用函数方法全集

    Attribute: $("p").addClass(css中定义的样式类型); 给某个元素添加样式 $("img").attr({src:"test ...

  9. jquery 常用工具方法

    inArray(value, array [, fromIndex ])方法类似于原生javascript的indexOf()方法,没有找到匹配元素时它返回-1.如果数组第一个元素匹配参数,那么$.i ...

  10. jQuery常用的方法

    each() 以每一个匹配的元素作为上下文来执行一个函数. size()  jQuery 对象中元素的个数.

随机推荐

  1. SQL中的连接可以分为内连接，外连接，以及交叉连接 。

    SQL中的连接可以分为内连接,外连接,以及交叉连接 . 1. 交叉连接CROSS JOIN 如果不带WHERE条件子句,它将会返回被连接的两个表的笛卡尔积,返回结果的行数等于两个表行数的乘积: 举例, ...

  2. 自动化运维工具——ansible详解（二）

    Ansible playbook 简介 playbook 是 ansible 用于配置,部署,和管理被控节点的剧本. 通过 playbook 的详细描述,执行其中的一系列 tasks ,可以让远端主机 ...

  3. 《Thinking in Android 9&period;0 系统开发源码钻研录》

    最近打算把个人站点的博客文章同步到"博客园"! Thinking in Android -- "系统启动" [启动阶段] [相关文章] 状态 源码版本 init ...

  4. Filter的使用（web作业）

    一:什么是过滤器 Filter:Servlet过滤器Fileter是一个小型的web组件,它们通过拦截请求和响应,以便查看.提取或以某种方式操作客户端和服务器之间交换的数据,实现“过滤”的功能.Fil ...

  5. InstallShield&period;12完美使用

    转载:http://www.360doc.com/content/13/0517/10/7918060_286039102.shtml 转载:http://jingyan.baidu.com/arti ...

  6. BZOJ 2654&colon; tree&lpar;二分 最小生成树&rpar;

    Time Limit: 30 Sec  Memory Limit: 512 MBSubmit: 2901  Solved: 1196[Submit][Status][Discuss] Descript ...

  7. &lbrack;水煮 ASP&period;NET Web API2 方法论&rsqb;（1-2）在 WebForm 应用程序中添加 ASP&period;NET Web API

    问题 怎么样将 Asp.Net Web Api 加入到 Asp.Net Web From 应用程序中 解决方案 在 Visual Studio 2013 中,创建新的 Web From,可以直接在&q ...

  8. Graylog2日志服务安装配置

    软件版本: mongodb-org-3.2.10 jdk-1.8.0 (推荐rpm包,不然要修改Graylog启动脚本定义的JAVA命令路径) elasticsearch-2.4.1 (Graylog ...

  9. CF873B Balanced Substring &lpar;前缀和&rpar;

    CF873B Balanced Substring (前缀和) 蛮有意思的一道题,不过还是.....................因为CF评测坏了,没有试过是否可过. 显然求\(\sum[i][0] ...

  10. GOF 23种设计模式目录

    经典的gof 23种设计模式,目录大纲查看. 1. Singleton(单例模式) 保证一个类只有一个实例,并提供访问它的全局访问点. 2. Abstract Factory(抽象工厂模式) 提供一个 ...

相关文章