chrome控制台通过css获取列表值

在极客时间买了个python课程，想边看边做笔记，需要每节课一个markdown文件，发现每次都手动去拷贝创建文件很麻烦，所以想直接一次性都创建完。下面是创建步骤。

1. 选中元素，鼠标右键Inspect，查看Html，找一下元素特征。如下，发现课程列表都是同一个Css Class Articlepc_txt_3djrl。

2. 用这个css选择器，在控制台输入$$(".ArticlePC_txt_3DJrl")，打印出所有元素，发现有47个。

3. 用map和string的replace函数继续处理数组

$$(".ArticlePC_txt_3DJrl").map(x=>"touch "+ (x.innerText).replace(/\s/g,"_").replace(/[？||]/g,"")+".md")

命令说明：

• map：对数组里的每个元素，执行括号里的操作，返回一个新数组。我这里用了个匿名函数，x=>x.innerText获取到每个元素的innerText属性后，替换特殊字符，首尾拼接字符串。
• replace:
  • .replace(/\s/g,"_")，把空格替换成下划线
  • .replace(/[？||]/g,""),删掉竖杠和中文问号
• +： 字符串拼接，首尾拼接 'touch '和'md'

4. 发现非正课如开篇词、建议都被输出来了，决定只保留有数字的课程标题，于是再用filter过滤出含数字的课程，如截图只剩下43个.最终达到效果。

$$(".ArticlePC_txt_3DJrl").map(x=>"touch "+ (x.innerText).replace(/\s/g,"_").replace(/[？||]/g,"")+".md").filter(item => {
			if (new RegExp(/touch\s\d\d*/g).test(JSON.stringify(item)))
				return item;
		})

5. 把最后输出的字符串拷贝到sublime, 把", "替换成换行，删掉首尾的双引号，就能直接拷贝到terminal批量创建所有文件了。

标签：map,chrome,replace,item,innerText,touch,控制台,txt,css
来源： https://www.cnblogs.com/stxz/p/15070566.html