색상 선택기 코드

div 내에서 배경색, 텍스트 색상, 활성 링크 색상, 방문한 링크 색상 등의 요소 색상을 변경하려면이 코드가 필요합니다. 텍스트 상자에 각 색상을 입력해야하므로 배경 색상, 텍스트 색상, 링크 색상이 변경됩니다. 이것은 프로그램 목표입니다. 하지만 활성, 따라 가기 및 방문한 링크의 색상을 변경할 수 없습니다. HTML, CSS 및 JavaScript만으로 어떻게 할 수 있습니까? 제발 jQuery를 모르는 것처럼 jQuery를 사용하는 어떤 메소드도 말하지 마십시오. 자바 스크립트로만 원한다.색상 선택기 코드

<html> 
    <head> 
    </head> 
    <body> 
     <script> 
      function fun() 
      { 
       var bg=document.getElementById("t1").value; 
       var txt=document.getElementById("t2").value; 
       var al=document.getElementById("t3").value; 
       var vl=document.getElementById("t4").value; 
       var hv=document.getElementById("t5").value; 
       document.getElementById("dv").style.backgroundColor=bg; 
       document.getElementById("dv").style.alinkcolor=txt; 
       document.getElementById("dv").style.vlinkcolor=al; 
       document.getElementById("dv").style.color=vl; 
       document.getElementById("dv").style.color=hv; 
      } 
     </script> 
     <h1>Enter Colors: </h1> 
     Background: <input type="text" id="t1" name="txt1"> 
     <br/><br/> 
     Text: <input type="text" id="t2" name="txt2"> 
     <br/><br/> 
     Link: <input type="text" id="t3" name="link"> 
     <br/><br/> 
     Active Link: <input type="text" id="t4" name="alink"> 
     <br/><br/> 
     Followed Link: <input type="text" id="t5" name="vlink"> 
     <br/><br/> 
     <input type="button" value="test" onclick="fun();"> 
     <br/><br/> 
     <div id="dv">&nbsp;hello 
      This is a Test<br/> 
      You Have Selected These Colors<br/> 
      <a href="#">This is a Test Link</a><br/> 
     </div> 
</body> 
</html>

출처

2011-10-17 raaz

가능한 중복 http://stackoverflow.com/questions/311052/setting-css-pseudo-class-rules-from-javascript – Nasreddine

없이 내 문제는 – raaz

어떻게 정확히 약간 다릅니다 그것은 다른가? – itzy

나는 요소에 ID 년대를 할당하여 코드를 업데이트했습니다. 다음은 업데이트 된 코드입니다. 도움이되는지 확인하려면이 코드를 시도하십시오. 감사.

<html> 
<head> 
</head> 
<body> 
    <script> 
     function fun() 
     { 
      var bg=document.getElementById("t1").value; 
      var txt=document.getElementById("t2").value; 
      var al=document.getElementById("t3").value; 
      var vl=document.getElementById("t4").value; 
      var hv=document.getElementById("t5").value; 
      document.getElementById("dv").style.backgroundColor=bg; 
      document.getElementById("link").style.alinkcolor=al; 
      document.getElementById("link").style.vlinkcolor=vl; 
      document.getElementById("para").style.color=txt; 
      document.getElementById("link").style.color=hv; 
     } 
    </script> 
    <h1>Enter Colors: </h1> 
    Background: <input type="text" id="t1" name="txt1"> 
    <br/><br/> 
    Text: <input type="text" id="t2" name="txt2"> 
    <br/><br/> 
    Link: <input type="text" id="t3" name="link"> 
    <br/><br/> 
    Active Link: <input type="text" id="t4" name="alink"> 
    <br/><br/> 
    Followed Link: <input type="text" id="t5" name="vlink"> 
    <br/><br/> 
    <input type="button" value="test" onclick="fun();"> 
    <br/><br/> 
    <div id="dv">&nbsp; 
     <p id="para">hello This is a Test<br/> 
     You Have Selected These Colors<br/><p> 
     <a id="link" href="#">This is a Test Link</a><br/> 
    </div>

출처

2014-10-12 15:56:03 user3347568

색상 선택기 코드

답변

관련 문제