[VBA] 네이버사전 Lv3.

엑사남 오픈채팅방의 [다잡]님이 드디어 유튜브를 시작하시면서 고급 코드들을 남발(?) 중이시다.

https://www.youtube.com/watch?v=gl_2d_wD13o 

당분간 크로링 강의를 하신다고 하니 강의를 들으면서 본인들의 레벨업을 하시기 바란다.

 

본인 역시 다잡님이 강의 때 선보인 코드 중 일부를 통해서 본인이 만들었던 [네이버 사전 만들기]를 다시 만들어 보았다.

네이버 사전 만들기 Lv1은 정말 지금은 어떻게 이런 코드를 만들었지 생각할 정도로 난잡하고 난해하게 만들었다면

네이버 사전 만들기 Lv2는 정규식을 통한 파싱을 하였지만 이것도 역시 가독성이 떨어진다.

네이버 사전 만들기 Lv3은 다잡님이 강의 때 선보인 자바스크립트 함수인 Queryselector로 파싱을 하는것인데,

이게 가독성도 좋고 직관성이 우수하다...단, 속도가 기존 GetelementsBy...  구문보다는 속도가 떨어진다고 하니 참고하길 바란다.

 

우선 발음기호부분은

네이버 사전 기준으로 [fnt_k10] class  이기에 

html.queryselector(".fnt_e25").innertext   이렇게 하면 해당 클래스의 텍스트를 가져온다.

여기서 주의 할 점은 클래스명 앞에는 [.] / Id앞에는[#]을 써주는건 참고 하길 바란다.

 

이번에 발음기호를 눌렀을때 미국식 발음이 나오는 부분이다.

개발자도구 상단에 Elements부분 옆에 Network영역을 보면 왼쪽에 Name 부분에 쿼리에 관한 내용들이 나오는데 첫번째를 클릭 후 

오른쪽 하단의 {}를 누르면 쿼리문이 쫘악하고 펼쳐지게 되는데 거기서 중간쯤에 보면 영어사전에 관한 내용들이 나오기 시작할 것이다.

 

이렇게 해도 되고 / 그냥 Elements에서 파싱을 하면 되는데 본인이 경험해 본 바 Network탭도 익숙해지고 공부하면  분명히 훌륭한 크롤러가 될 수 있으리라 본다.

a playlist를 파싱해서 Html부분만 가져와서 하이퍼링크에 걸면된다.

이렇게 정상적으로 되었다면 발음기호를 클릭하였을 경우 발음이 나오게 된다.

 

뜻부분은 이렇게  dd태그 안에 있다.

미리 겁먹지 마라. 이것도 너무나 간단히 할 수 있다.

끌어와야 할 태그의 가장위에서 오른쪽 마우스를 눌러서

copy selector를 누른다. 이렇게 복사된 요소의 내용을 붙혀넣기 하면

[ #content > div.en_dic_section.search_result.dic_en_entry > dl > dd:nth-child(2) ] 이렇게 나오는데

이걸그냥 queryselector 안에 넣어서 innertext를 가져오기만 하면된다.

 

 

 

해당 사항에 오류가 있어 수정하여 올렸습니다.

https://1stminokingdom.tistory.com/176

[VBA] 네이버 영어사전 LV4.(댓글 요청)