Какая функция позволяет добавить ссылку на графику в javascript в document.createElement?

#javascript #graphics #href

#javascript #графика #href

Вопрос:

Я настраиваю временную шкалу, используя примеры изhttp://visjs.org/docs/timeline/#Example. Может кто-нибудь сказать мне, что мне нужно, чтобы добавить локальную ссылку на имеющуюся у меня графику?

Я пробовал.href, но, возможно, я делаю что-то неправильно. Вот фрагмент с моим закомментированным кодом:

 var item5 = document.createElement('div');
  item5.appendChild(document.createTextNode('item 5'));
  item5.appendChild(document.createElement('br'));
  var img5 = document.createElement('img');
  // img5.a.href = 'attachments/AddDuties.pdf';
  img5.src = 'icons/pdf1.png';
  img5.style.width = '48px';
  img5.style.height = '48px';
  item5.appendChild(img5);

Вот еще немного кода (я вырезал части, чтобы уменьшить размер, это работает до того, как я добавлю свой собственный код ниже на изображении 5 :). Изображение 5 — это то, с помощью которого я хочу связать графику с файлом.

   <title>Timeline | Basic demo</title>
  <script src="vis-4.21.0/dist/vis.js"></script>
  <link href="vis-4.21.0/dist/vis.css" rel="stylesheet" type="text/css" />
</head>
<body>'
<script>
  // create a couple of HTML items in various ways

  var item1 = document.createElement('div');
  item1.appendChild(document.createTextNode('item 1'));

  var item4 = 'item <span class="large">4</span>';

  **var item5 = document.createElement('div');
  item5.appendChild(document.createTextNode('item 5'));
  item5.appendChild(document.createElement('br'));
  var img5 = document.createElement('img');
  // img5.a.href = 'attachments/AddDuties.pdf';
  img5.src = 'icons/pdf1.png';
  img5.style.width = '48px';
  img5.style.height = '48px';
  item5.appendChild(img5);**

</body>

Я ожидаю, что смогу щелкнуть рисунок и перейти по назначенной ссылке. Я знаю, как использовать href в HTML, я просто не знаю, какой код должен указывать javascript, как связать графику на изображении 5.

Ответ №1:

href — это атрибут для <a> тега. вы не можете добавить href к изображению.
Что вам нужно сделать, это создать <a> элемент, присвоить ему нужный href и
добавить img в качестве дочернего элемента этого <a> элемента.

 <a href="{whatever you want}">
    <img src=....>
</a>

редактировать:

если по какой-либо причине вы не можете обернуть изображение с помощью <a> , вы могли бы назначить и id изображению, а затем добавить прослушиватель событий для щелчка, который перенаправит вас.

1. Спасибо. Я понимаю, как использовать тег href, но в приведенном выше коде кажется, что он должен содержать отдельную строку, такую как `img5.a.href = ‘attachments / dallasadduties.pdf’; но это не сработало. Если я могу использовать код, подобный вашему, куда он попадает в моем коде?

2. прежде чем item5.appendChild(img5);** вы могли бы попробовать создать a элемент, скажем, a5 присвоив ему href . добавление img5 к этому новому a5 элементу и добавление a5 к item5 .