1.2.1 标签选择器 · 多多猫插件开发指南

## 定位获取标签内容 ```html <html> <head> <title>我是标题</title> </head> <body> <div>测试文本1</div> <p>测试文本2</p> <p>测试文本3</p> </body> </html> ``` 上面的示例有四段文本内容，那么我们来获取这四段文本内容，用css选择器的方式首先是 `title`标签内容，可以这么写 ```javascript //定位到title标签 $('title') //获取文本 $('title').text() ``` 通过上面的示例我们知道了获取文本可以使用`text()`方法，`div`标签内容同上，可以这么写 ```javascript //定位到div标签 $('div') //获取文本 $('div').text() ``` 接下来我们获取`p`标签内容，然后有人就说了，这里有两个`p`标签，如何取呢？可以这么写 ```javascript //定位到p标签 $('p') //获取第一个p的文本 $('p').eq(0).text() //获取第二个p的文本 $('p').eq(1).text() ``` 接下来我们再看一个例子 ```html <html> <head> <title>我是标题</title> </head> <body> <div> <p>测试文本1</p> </div> <span> <p>测试文本2</p> </span> </body> </html> ``` 这时候我们如何来分别获取这两个`p`标签的内容呢？我们第一章说过，网页是标签的层级结构，一层层包含，那么我们可以这么写： ```javascript //获取第一个p标签内容 $('div p').text() //获取第二个p标签内容 $('span p').text() ``` 这时候可能有人问了，为什么不写成下面这样 ```javascript //获取第一个p标签内容 $('html body div p').text() //获取第二个p标签内容 $('html body span p').text() ``` 那是因为html和body都是唯一的，不可能有多个，所以我们即使不写上它们也不会影响我们的定位<br> **通过上面的示例我们也发现了，我们根本不需要知道所有标签的含义，只需要知道我们感兴趣的内容在哪个位置即可**<br>