工作之中的不足，报了js培训班，因为工作加班原因缺了几天课（js组件开发），现在拾起来补补
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="智能社 - zhinengshe.com" />
<meta name="copyright" content="智能社 - zhinengshe.com" />
<title>智能社 - www.zhinengshe.com</title>
<!-- 写组件的步骤：
先布局 写css
创建元素 插入到指定位置
添加事件
联动
隐藏系统元素
封装
js
css -->
<script src="myRadio.js"></script>
<script>
//var added = true;
window.onload = function(){
myRadio("sex");
myRadio("city");
};
</script>
</head>
<body> <form id="form1" action="http://www.zhinengshe.com/" > <input type="radio" name="sex" value="male"/>男
<input type="radio" name="sex" value="female"/>女
<input type="radio" name="sex" value="unknow" />未知
<br />
<input type="radio" name="city" value="city1"/>city1
<input type="radio" name="city" value="city2"/>city2
<input type="radio" name="city" value="city3" />city3
<input type="submit"/>
</form> </body>
</html>
//版权 北京智能社©, 保留所有权利
(function(){
var added = false;
console.log('');
window.myRadio = function (name){ var aRadio = document.getElementsByName(name); var aSpan = [];
//创建span
for(var i = ; i < aRadio.length; i++){
var oSpan = document.createElement("span");
aSpan.push(oSpan);
oSpan.className = "my_radio";
aRadio[i].parentNode.insertBefore(oSpan,aRadio[i]); (function(index){
oSpan.onclick = function(){
for(var i = ; i < aSpan.length; i++){
aSpan[i].className = "my_radio";
}
this.className = "my_radio_active";
aRadio[index].checked = true;
};
})(i); aRadio[i].style.display = "none";
}
console.log('aaaaaa');
if(added) return;
console.log('');
added = true;
console.log('');
var oLink = document.createElement("link");
oLink.rel = "stylesheet";
oLink.href = "myRadio.css";
var oHead = document.getElementsByTagName("head")[];
oHead.appendChild(oLink); } })();
