<script>
// document.querySelector('#div1>p');
//选择出符合选择器要求的第一个元素
/*
document.querySelectorAll('#div>p');
选择出符合条件的所有
*/
window.onload = function () {
var ps = document.querySelectorAll('#div1>p');
// console.log(ps);
//for in 无法使用
// for (var i in ps) {
// ps[i].style.color = '#f40';
// ps[i].style.backgroundColor = '#000';
// }
// ps.forEach(function (item, index) {
// // console.log(item, index);
// })
for (var i = 0; i < ps.length; i++) {
console.log(ps[i].className);
addClassName(ps[i], 'c1');//添加css样式
removeClassName(ps[i],'c1');//删除css样式
//p[i].className ="c1";
}
//封装成函数
function addClassName(element, className1) {//c2 c3
//1.判断是否已经存在
var classNames = element.className.split(' ');
// c1 c2
for (var i = 0; i < classNames.length; i++) {
if (classNames[i] === className1){
break;
}
}
//没找到
if (i === classNames.length) {
if(element.className ===""){
element.className = className1;
}else{
element.className += ' ' + className1;
}
}
}
function removeClassName(element,className1){
//1.判断是否已经存在
var classNames = element.className.split(' ');
// c1 c2
for (var i = 0; i < classNames.length; i++) {
if (classNames[i] === className1){
break;
}
}
//找到7
if(i !== classNames.length){
classNames.splice(i,1);
element.className = classNames.join(' ');
}
}
}
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/4924.html