Блог

Итак, в принципе, у меня есть несколько элементов с некоторыми значениями данных в файле. Я хочу динамически создавать ссылки на них, используя эти значения данных для ввода текста, href и т.д.

Например, у меня есть два divs, id’ed first и second . Они имеют importance значения, соответственно «наиболее важные» и «наименее важные».

Я хочу создать две ссылки на них с фразой «Это ссылка на самый / наименее важный div», используя JavaScript / jQuery. Ниже приведен нерабочий пример.

Файл a.html (без заголовков и тому подобное, ofc):

 <div id='first' data-importance='most important'>This is the first div.</div>

<div id='second' data-importance='least important'>This is the second div.</div>
  

Файл b.html :

 <p><a class='makelink' data-linkto='first'></a></p>

<p><a class='makelink' data-linkto='second'></a></p>

$(`.makelink`).each( function(){
  var target = $(this).data('linkto');
  $(this).attr('href','b.html#'   target);
  var imp = $('b.html #'   target).data('importance'); 
  $(this).html('Link to the '   imp   ' div');
});
  

Однако ничего не происходит. Приветствуется любая помощь.

Ваш код кажется правильным, за исключением того, что селектор должен быть внутри кавычек, а строка, сгенерированная в html() , неправильно отформатирована:

 $('.makelink').each( function(){ // Enclosed the selector with single/double qoute
  var target = $(this).data('linkto');
  $(this).attr('href','#'   target);
  var imp = $('#'   target).data('importance'); 
  $(this).html('Link to the '  imp   ' div'); // concatenate the string with the variable using  
});  

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id='first' data-importance='most important'>This is the first div.</div>

<div id='second' data-importance='least important'>This is the second div.</div>

<p><a class='makelink' data-linkto='first'></a></p>

<p><a class='makelink' data-linkto='second'></a></p>