• 欢迎访问一然博客,WordPress信息,WordPress教程,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站,欢迎加入一然博客 QQ群
  • Git主题现已支持滚动公告栏功能,兼容其他浏览器,看到的就是咯,在后台最新消息那里用li标签添加即可。
  • 最新版Git主题已支持说说碎语功能,可像添加文章一样直接添加说说,新建说说页面即可,最后重新保存固定连接,演示地址
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏一然博客吧

使用WP-AutoPost设置采集规则,如何设置CSS选择器

采集插件 一然 8个月前 (03-16) 542次浏览 已收录 0个评论

要使用WP-AutoPost设置采集规则,只需要掌握基本的CSS选择器知识即可。

如需学习更多可以参考http://www.w3c-schools.com

基础选择器

选择器示例 含义
h1 标签选择器,匹配所有使用<h1>标签的元素
a 标签选择器,匹配所有使用<a>标签的元素
.info class选择器,匹配所有class属性等于info的元素
#info id选择器,匹配所有id属性等于footer的元素

class选择器前面有 号,  .some_word

id选择器使前面有 # 号, 如 #some_word

例如某篇文章的标题HTML代码如下:

使用WP-AutoPost设置采集规则,如何设置CSS选择器

因此该文章标题的CSS选择器就是  .entry-title

如果是:

使用WP-AutoPost设置采集规则,如何设置CSS选择器

该文章标题的CSS选择器就是  #artibodyTitle

例如某篇文章的正文内容HTML代码如下:

使用WP-AutoPost设置采集规则,如何设置CSS选择器

该文章内容的CSS选择器就是  .entry

后代元素选择器

选择器示例 含义
div  p 匹配所有在<div>元素内部的<p>标签元素
div  li  a 匹配所有在<li>元素内部的<a>标签元素,并且<li>元素又在<div>元素内部
.contList  a 匹配所有在 class属性等于contList元素内部 的<a>标签元素
#contList  a 匹配所有在 id属性等于contList元素内部 的<a>标签元素
#contList  li  a 匹配所有在 <li>元素内部的<a>标签元素,并且<li>元素又在 id属性等于contList元素内部 

后代元素选择器,每个元素之间用空格隔开

例如要设置文章来源选项卡里的文章网址CSS选择器,文章列表网址里每篇文章超链接HTML代码如下:

使用WP-AutoPost设置采集规则,如何设置CSS选择器

因为每篇文章的网址(a 标签)都在class=“contList”的元素内部,所以该文章网址CSS选择器可以设置为  .contList  a

在上面例子中因为<a>标签也在<li>标签内部,因此也可以设置为 .contList  li  a

同理<li>标签又在<ul>标签内部,因此也可以设置为 .contList  ul  li  a

以上3个设置都是等价的。


极客公园 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:使用WP-AutoPost设置采集规则,如何设置CSS选择器
喜欢 (0)
[]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址