Не удается настроить таргетинг на элемент SVG с помощью селектора запросов - PullRequest
0 голосов
/ 27 сентября 2018

У меня есть большой svg-файл, который отображается на html-странице со следующим кодом

<svg
   xmlns:dc="http://purl.org/dc/elements/1.1/"
   xmlns:cc="http://creativecommons.org/ns#"
   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.0"
   width="680"
   height="520"
   viewBox="1754 161 9938 7945"
   id="svg2">
  <title
     id="title4">Countries of Europe</title>
  <desc
     id="desc6"> A blank Map of Europe. Every country has an id which is its ISO-3166-1-ALPHA2 code in lower case.
 Members of the EU have a class=&quot;eu&quot;, countries in europe (which I found turkey to be but russia not) have a class=&quot;europe&quot;.
 Certain countries are further subdivided the United Kingdom has gb-gbn for Great Britain and gb-nir for Northern Ireland. Russia is divided into ru-kgd for the Kaliningrad Oblast and ru-main for the Main body of Russia. There is the additional grouping #xb for the &quot;British Islands&quot; (the UK with its Crown Dependencies - Jersey, Guernsey and the Isle of Man) 
 ... file continues on 

Я использовал этот код javascript для различных разделов svg-кода, нацеленных на их идентификатор с помощью этогокод

document.querySelector('svg').addEventListener('click',function(e){
    const dir = (e.target.closest('g').id);
    alert(dir);
});

но я получаю эту ошибку:

Uncaught TypeError: Cannot read property 'addEventListener' of null
at Object.<anonymous> (index.js:29)
at __webpack_require__ (bootstrap f06ab605832628ed0f5f:19)
at Object.<anonymous> (html5-entities.js:190)
at __webpack_require__ (bootstrap f06ab605832628ed0f5f:19)
at bootstrap f06ab605832628ed0f5f:62
at bootstrap f06ab605832628ed0f5f:62

всякий раз, когда я щелкаю по большинству деталей, он возвращает другую ошибку:

(index):27 Uncaught TypeError: Cannot read property 'addEventListener' of null

, но малочасти чертежа предупреждают идентификатор элемента

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...