res 百瀬様 | sikaku

response

再度のご連絡ありがとうございます。

現在ソースが下記の状態なので、修正後の並びになるよう編集してください。

前回お伝えした時点から何一つ修正されていないのを見るに、おそらく相当説明が解りづらかったかと思います。　今後も相談をとの事ですが、基礎的な事に関しては数ある解説サイトさんより上手く説明できる気がしないので、これ以上お力になれることは何も無いです。

source code

※webページ基本構成及び当サイト配布物と関係のない記述は省略表記としています。

現在状況


        
	<!doctype html>
	<html lang="ja">
	  <head>
	    省略
	    <DOCTYPE宣言>
	    <style type="text/css">
	      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	      <script>
	        $(function(){
	        colorScheme($('#color_scheme_list > li'),$('#color_scheme_temp').html());
	        function colorScheme($tgt,temp){
	        	temp = temp.replace(/(data-style=")/g,'style="');
	        	$tgt.each(function(){
	        		var color = $(this).text().replace(/\s+/g,' ').split('/');
	        		for (var i=0,txt=temp;i<color.length;i++)
	        			txt = txt.replace(RegExp('(#c'+i+'#)','g'),color[i]);
	        		$(this).html(txt);
	        	});
	        }
	        });
	    </style>
	      </script>
	
	
	    <body>
	      <ul id="color_scheme_list">
	        <li>#f4ead5/#98607c/#e94e77</li>
	        <li>#e0e0c0/#000000/#c0e000</li>
	        <li>#4080a0/#f0f0c0/#ffffff</li>
	        <li>#ffeec0/#cccccc/#c0ffee</li>
	      </ul>
	      <template id="color_scheme_temp">
	        <span data-style="color:#c0#;">#c0#</span>
	        <span data-style="color:#c1#;">#c1#</span>
	        <span data-style="color:#c2#;">#c2#</span>
	      </template>
	    </body>
	</html>
	
	  </head>
	  <body>
	    省略
	  </body>
	</html>

修正後


        
	<!doctype html>
	<html lang="ja">
	  <head>
	    省略
	    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	    <script>
	      $(function(){
	      colorScheme($('#color_scheme_list > li'),$('#color_scheme_temp').html());
	      function colorScheme($tgt,temp){
	        	temp = temp.replace(/(data-style=")/g,'style="');
	        	$tgt.each(function(){
	        		var color = $(this).text().replace(/\s+/g,' ').split('/');
	        		for (var i=0,txt=temp;i<color.length;i++)
	        			txt = txt.replace(RegExp('(#c'+i+'#)','g'),color[i]);
	        		$(this).html(txt);
	        	});
	        }
	        });
	    </script>
	  </head>
	  <body>
	    <ul id="color_scheme_list">
	      <li>#f4ead5/#98607c/#e94e77</li>
	      <li>#e0e0c0/#000000/#c0e000</li>
	      <li>#4080a0/#f0f0c0/#ffffff</li>
	      <li>#ffeec0/#cccccc/#c0ffee</li>
	    </ul>
	    <template id="color_scheme_temp">
	      <span data-style="color:#c0#;">#c0#</span>
	      <span data-style="color:#c1#;">#c1#</span>
	      <span data-style="color:#c2#;">#c2#</span>
	    </template>
	  </body>
	</html>

基本構成(再掲)


        
	<DOCTYPE宣言>
	<html>
	  <head>
	    ページ設定
	  </head>
	  <body>
	    ページ表示内容
	  </body>
	</html>