Обновление текста при нажатии checkbox

275

09 февраля 2017, 02:31

Есть код обновления адресной ссылки по нажатию на checkbox

var w = document.querySelector('#wall'), 
  a = document.querySelectorAll('a')[0]; 
w.onclick = function() { 
  if (w.checked) { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=(?:[A-Za-z_0-9-]+\,?)*)[^&]*(\&.*)$/, '$1wall,$2')); 
  } else { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=)[^&]*(\&.*)$/, '$1$2')); 
  } 
  console.log(a.getAttribute('href')); 
} 
 
var m = document.querySelector('#messages'), 
  a = document.querySelectorAll('a')[0]; 
m.onclick = function() { 
  if (m.checked) { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=(?:[A-Za-z_0-9-]+\,?)*)[^&]*(\&.*)$/, '$1messages,$2')); 
  } else { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=)[^&]*(\&.*)$/, '$1$2')); 
  } 
  console.log(a.getAttribute('href')); 
}

<a href='https://oauth.vk.com/authorize?client_id=4113&scope=notify,&redirect_uri=https://oauth.vk.com/blank.html&response_type=token'><b>ссылке</b></a> 
<input type="checkbox" id="wall">Отправка посто 
<br> 
<input type="checkbox" id="messages">Работа с сообщениями 
<br>

Все работает, но если перед ссылкой вставить другую ссылку, то код перестает работать. Пробовал менял a = document.querySelectorAll('a')[0-на другие]; на a = document.querySelectorAll('#someid')[0]; К ссылке подставлял id="someid". Он стал изменять первую ссылку, хотя у первой ссылки вообще не было id

Answer 1

Что-то Вы не договариваете. Все работает, если правильно обратиться к элементу

var w = document.querySelector('#wall'), 
  a = document.querySelectorAll('#link')[0]; 
w.onclick = function() { 
  if (w.checked) { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=(?:[A-Za-z_0-9-]+\,?)*)[^&]*(\&.*)$/, '$1wall,$2')); 
  } else { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=)[^&]*(\&.*)$/, '$1$2')); 
  } 
  console.log(a.getAttribute('href')); 
} 
 
var m = document.querySelector('#messages'), 
  a = document.querySelectorAll('#link')[0]; 
m.onclick = function() { 
  if (m.checked) { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=(?:[A-Za-z_0-9-]+\,?)*)[^&]*(\&.*)$/, '$1messages,$2')); 
  } else { 
    a.setAttribute('href', a.getAttribute('href').replace(/^(.*\&scope\=)[^&]*(\&.*)$/, '$1$2')); 
  } 
  console.log(a.getAttribute('href')); 
}

<a href="javascript:void(0)">Test</a> 
<a href='https://oauth.vk.com/authorize?client_id=4113&scope=notify,&redirect_uri=https://oauth.vk.com/blank.html&response_type=token' id="link"><b>ссылке</b></a> 
<input type="checkbox" id="wall">Отправка посто 
<br> 
<input type="checkbox" id="messages">Работа с сообщениями 
<br>