>  기사  >  웹 프론트엔드  >  js 일괄 설정 요소 스타일 및 캡슐화 CSS 방법 튜토리얼은 jquery와 유사합니다.

js 일괄 설정 요소 스타일 및 캡슐화 CSS 방법 튜토리얼은 jquery와 유사합니다.

巴扎黑
巴扎黑원래의
2017-07-21 17:43:031345검색

1. 일괄 설정 스타일 setGroupCss

function setGroupCss(curEle,options){//通过检测options的数据类型,如果不是一个对象,则不能进行批量操作if(Object.prototype.toString.call(options)!=="[object Object]"){return;
            }//遍历对象中的每一项,调取setCss方法一个个进行设置即可for(var key in options){if(options.hasOwnProperty(key)){
                    setCss(curEle,key,options[key])
                }        
            }
        }

2. CSS 메서드 캡슐화

//此方法实现了获取、单独设置、批量设置元素的样式值function css(curEle){var argTwo = arguments[1];if(typeof argTwo === "string"){//传递第二个参数是一个字符串,这样的话可能就是获取样式;为什么是可能呢?因为还需要判断是否存在第三个参数,如果第三个参数存在的话,不是获取了,而是在单独的设置样式属性值var argThree = arguments[2];if(typeof argThree === "undefined"){//第三个参数不存在// return getCss(curEle,argTwo);return getCss.apply(this,arguments)
                }//第三个参数存在则为单独设置// setCss(curEle,argTwo,argThree)setCss.apply(this,arguments)return;
            }
            argTwo = argTwo || 0;//这行是为了 防止argTwo不存在为undefined的时候,下面的toString会报错if(argTwo.toString()==="[object Object]"){//批量设置样式属性值setGroupCss.apply(this,arguments)
            }
        }

위 내용은 js 일괄 설정 요소 스타일 및 캡슐화 CSS 방법 튜토리얼은 jquery와 유사합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.