<!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(),val()

    @@@@属性篇: 写作本篇文章的意义: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. Java-Servlet--《12-WEB应用中的普通Java程序如何读取资源文件.mp4》 有疑问

    \第五天-servlet开发和ServletConfig与ServletContext对象\12-WEB应用中的普通Java程序如何读取资源文件.mp4; 多层时,DAO为了得到资源文件中的配置参数: ...

  2. vue 学习笔记—Resource

    1.首先是引入  或者用npm来安装  cnpm i vue-resource --save(推荐) 3.提供的api 关于请求写法: get(){ // get请求 this.$http.get( ...

  3. vue2.0安装

    vue2.0环境安装 参考网站http://www.open-open.com/lib/view/open1476240930270.html (以上博客vue init webpack-simple ...

  4. HDU 4612 Warm up 连通图缩点

    题目大意:给出一个连通图,求再一个边后,剩余的最少桥数. 题目思路:首先进行缩点得到重构后的图,求出重构后树的直径(通过两次BFS求出相距最远的两点间的距离),ans=重构图边数-树的直径 //#pr ...

  5. xadmin后台页面定制和添加服务器监控组件

    xadmin定制 项目需要添加服务器监控页面,碍于xadmin不是很好自定义页面,之前写过插件,太麻烦了,还是直接改源码 原理其实很简单,因为xadmin的处理流程和django类似,都是通过拦截UR ...

  6. Android软键盘在清单文件中所有配置含义

    android:windowSoftInputMode 活动的主窗口如何与包含屏幕上的软键盘窗口交互.这个属性的设置将会影响两件事情: 1>     软键盘的状态——是否它是隐藏或显示——当活动 ...

  7. 【转】HTTP

    [转]HTTP 一.http概述 超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.所有的WWW文件都必须遵守这个标准.设计HTT ...

  8. struts2框架之请求参数（参考第二天学习笔记）

    获取请求参数 请求参数:表单中的数据,或者是超链接中的数据. 1. 得到request,再通过request来获取.2. 属性驱动 在Action中提供与表单字段名称相同的属性即可. 而一个名为par ...

  9. Java 处理 XML

    DOM 优缺点:实现 W3C 标准,有多种编程语言支持这种解析方式,并且这种方法本身操作上简单快捷,十分易于初学者掌握.其处理方式是将 XML 整个作为类似树结构的方式读入内存中以便操作及解析,因此支 ...

  10. EasyUI tree 选中父节点子节点全部选中，选中子节点父节点不选中

    需求:EasyUI tree 选中父节点子节点全部选中,选中子节点父节点不选中 效果:   /**   * 给树增加onCheck事件,首先使用cascadeCheck:false属性禁止全选,   ...