element.setAttribute

문제점: css,js,html을 이렇게 줬는데, 자꾸 하나만 클릭해도 모든 글이 다 visited가 먹음.....

 

css

.t:visited {
    color: #99209b;
}

js

function clearhref(){
    document.getElementsByClassName("t").href = "/newsclick";
}

html

<a target="_blank" class="t" onclick="clearhref()" 
style="cursor: pointer;">{{result[0]}}</a>

 

해결방법: element.setAttribute로 속성을 해당 요소에 주어진 값으로 설정하고, 

               onclick="clearhref(this)" 으로 줘서 클릭한 값에만 visited 된 것으로 설정!!

 

html

<a target="_blank" class="t" onclick="clearhref(this)" 
style="cursor: pointer;">{{result[0]}}</a>

 

js

// element라는 매개변수를 가지며, 이는 변경하고자 하는 요소를 나타냄.
// setAttribute 메서드는 해당 요소의 지정된 속성을 주어진 값으로 설정
// element.setAttribute("name"-변경하려는 속성의 값, "value"-속성에 설정할 값);
function clearhref(element) {
    element.setAttribute("href", "/newsclick");
}​

 

<결과>

위에가 클릭한 글, 밑에는 클릭하지 않은 글