<!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 常用的方法
原文地址：https://www.cnblogs.com/LindaBlog/p/9805910.html