此博客链接：https://www.cnblogs.com/ping2yingshi/p/12890443.html
js普通版本
<html> <body> <script> var str1 = "红色"; var str2 = "黑色"; var str3 = "蓝色"; document.write("<p> " + str1.fontcolor("red") +str2.fontcolor("black")+str3.fontcolor("blue")+ "</p>"); </script> </body> </html>
js调用函数版本：
<html> <body> <script> function myFunction(str1,color1,str2,color2,str3,color3){ var str=""; str=str.concat(str1.fontcolor(color1)); str=str.concat(str2.fontcolor(color2)); str=str.concat(str3.fontcolor(color3)); //document.write("<p>"+ str+"</p>"); return str; } document.write(myFunction("红色","red","黑色","black","蓝色","blue")); //var strd=myFunction("红色","red","黑色","black","蓝色","blue") // document.write(strd); </script> </body> </html>
效果图
2.html普通版本
<text style="color:red">红色</text> <text style="color:black">黑色</text> <text style="color:blue">蓝色</text>
html调用函数版本：
<html> <body> <div id="main1"> <p>红色</p> <p>red</p> </div> <div id="main2"> <p>黑色</p> <p>black</p> </div> <div id="main3"> <p>蓝色</p> <p>blue</p> </div> <script> var x=document.getElementById("main1"); var y=x.getElementsByTagName("p"); var m=document.getElementById("main2"); var n=m.getElementsByTagName("p"); var p=document.getElementById("main3"); var q=p.getElementsByTagName("p"); function myFunction(str1,color1,str2,color2,str3,color3){ var str=""; str=str.concat(str1.fontcolor(color1)); str=str.concat(str2.fontcolor(color2)); str=str.concat(str3.fontcolor(color3)); //document.write("<p>"+ str+"</p>"); return str; } document.write( myFunction(y[0].innerHTML,y[1].innerHTML, n[0].innerHTML,n[1].innerHTML,q[0].innerHTML,q[1].innerHTML)); </script> </body> </html>
3.css普通版本
<html> <body> <view class="redstr">红色</view> <view class="blackstr">黑色</view> <view class="bluestr">蓝色</view> <style> .redstr { color:red; } .blackstr { color:black; } .bluestr { color:blue; } </style> </body> </html>
css函数版本