Как мне создать счетчик кликов и в то же время создать такой элемент, как график? - PullRequest
0 голосов
/ 29 февраля 2020

Я надеюсь, что кто-то из вас может мне помочь, я пытаюсь создать чистую графовую таблицу из JavaScript и CSS. То, что я пытаюсь сделать, немного сложно. Я хочу создать счетчик для каждой ссылки, которая у меня есть на разных страницах в Интернете, поэтому, когда я нажимаю на эту ссылку. он будет считать количество кликов для каждого из них. Теперь в то же время я хочу, чтобы из этих ссылок можно было создать элемент Div, где я могу создать график каждой ссылки, как показано на рисунке ниже. enter image description here

Как вы видите, мне нужно ввести один для создания элемента и один, который увеличивает зеленые div, которые у меня есть каждый раз, когда я нажимаю на вход увеличения на + 1px. Теперь моя цель -

я хочу получать общее количество кликов каждый раз, когда пользователь или пользователи нажимают на эту ссылку, я хочу сохранять эти клики в локальном хранилище, поэтому каждый раз, когда я обновляю * 1019 На странице количество нажатий не будет потеряно, и из каждой указанной c ссылки создаются эти зеленые div, обычно зная, что не каждый раз, когда нажимают на ссылку, также создается другой Div дополнительно к этой ссылке. Только один раз и с этого момента мы запускаем счетчик кликов и также обычно увеличиваем до высоты этого элемента. Теперь у меня есть код для этого текущего примера ниже: Индекс. html

    <body>
    <input type="button" id="btn" value="add element">
    <input type="button" disabled='true' id="link" value="increase element">
    <p id="result">0</p>
    <div id="box"></div>
    <script src="mainOne.js"></script>
</body>

и код javascript

    var btn=document.getElementById("btn");
var box=document.getElementById("box");
var link=document.getElementById("link");
var para=document.getElementById("result");

let click = 0;

let numDiv = -1;


btn.onclick=function(){

  link.disabled = false;

    click = 0;
    para.innerHTML=click;


    let div=document.createElement("div");
    div.classList.add("bar");


    numDiv++;                 
    div.id = 'div'+numDiv;    

    var x=div.style.left =+25 * numDiv + 'px';
    console.log(x);

    box.appendChild(div);


}


link.onclick=function(){

  click++;

  var b=document.getElementById('div'+numDiv).style.height = click+'px';
  console.log(b);

  para.innerHTML=click;

}

Так что, пожалуйста, если кто-то может мне помочь, с это или предложить мне что-то или метод, для которого я могу сделать. это?

Все равно спасибо за помощь

...