当前位置:   article > 正文

爬虫onclick_爬虫基本功之学点JSDOM操作(一)

爬虫 dom操作 click事件

a3f50f517a9c305eb54145dda5647ed1.gif

点击上方蓝字关注

前面我总结了我最近学习js基础部分,当时提到过js分了三大部分,第一部分ECMA基础也就是第一次写的基础部分,爬虫基本功之学点JS(一), 第二部分也就是DOM部分,也就是这里要写的内容的,然后第三部分BOM部分,后面抽时间再写。

学dom有啥用

1.首先用的最多就是web开发了,js对各种html对象操作,比如我们用到的下拉到底部看完注册条例才能点击下步,改变div元素的各种属性大小颜色之类的,再就是各种事件onclick等一系列,经常用到的动态添加节点等等这些都需要对dom对象进行操作。

2.除了在网页开发的时候需要使用,在做爬虫的时候对网页的分析也需要进行dom操作,比如
获取https://www.cnblogs.com/c-x-a/页面的所以标题,此时我们就需要有一点的获取元素的基础,对于做爬虫来讲其实有三种方案,而更多的还是选择去操作dom对象。
一个是正则表达式,一个是css选择器方式,再就是xpath方式.其中后面的css选择器的方式就需要使用很多选择元素的语句,比如在我们通过getElementsByClassName获取这个元素之后,通过innerText可以获取其值,等等一系列操作,到这里我们就知道了学习js的dom部分重要性了,下面就对最近学到的一些内容做一个总结。

对网页元素的操作

首先我们打开https://www.cnblogs.com/c-x-a/,可以看到所以发布的文章的列表.
通过F12打开开发者工具,我们使用console命令进行下面的一系列操作。
输入下面的内容,然后回车就可以看我们需要的内容了,代码的含义在代码里已经加入注释。

DOM对象操作方式:

// 根据元素的class属性的值获取元素对象。获取的是一个列表divNodeList = document.getElementsByClassName("postTitle");//遍历每一个元素并做一系列操作。for(var a=0;a    v=divNodeList[a]    //childNodes可以获取所有
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/菜鸟追梦旅行/article/detail/396748
推荐阅读
相关标签
  

闽ICP备14008679号