`
zhangyaochun
  • 浏览: 2613786 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

给目标元素添加className-addClass

阅读更多

api的应用场景是:给目标元素添加className

 

 

关于className的资料http://zhangyaochun.iteye.com/blog/1456976

关于ZYC.dom.g请看这里:http://zhangyaochun.iteye.com/blog/1439262

 

简单描述:

                  如果需要一次调用添加多个class只需用空白符分割:如'red yellow black'      

 

 

/*
*addClass-add the className to the element*
*@function*
*@param {string||HTMLElement} element*
*@param {string} className---it can add more than one className,split each other by whitespace*
*@return {HTMLElement} element
*@remark the className is legal or not *
*you can reference in http://www.w3.org/TR/CSS2/syndata.html*
*/
ZYC.dom.addClass = function(element,className){
         element = ZYC.dom.g(element);
	 //must flow the rule ---split each other by whitespace(one or more)
	 //and the whitespace do not just space(制表符或者换行符)
	 var classArray =className.split(/\s+/),
	     result = element.className,  //element old className
		 i =0,
		 classMatch = " "+result+" ",  //used to check if has then decide if add
		 _length=classArray.length;
	 for(;i<_length;i++){
         if(classMatch.indexOf(" "+classArray[i]+" ") <0){
		    //if classArray[i] is new add it
			//and attention (result ? " ":"") if element old className is empty
		    result += (result ? " ":"") + classArray[i];
		 }		 
     }
	 element.className = result;
	 return element;
};
0
0
分享到:
评论

相关推荐

    jQuery知识点总结

    - `addClass(className)`: 添加类样式。 - `removeClass(className)`: 删除类样式。 - `toggleClass(className)`: 切换类样式。 #### 4. 元素值 - `val([value])`: 获取或设置表单元素的值。 ### 三、添加/删除...

    javascript自定义的addClass()方法

    在原生JavaScript中,并没有内置的addClass()方法,这个方法通常在jQuery库中出现,用于向选定的元素添加一个或多个类。然而,在没有引入jQuery的项目中,我们可以通过编写自定义的JavaScript函数来实现类似的功能。...

    使用JS实现jQuery的addClass, removeClass, hasClass函数功能

    addClass函数的作用是给指定的HTML元素添加一个或多个class。在实现addClass函数时,我们首先需要获取目标元素的当前class属性值。如果存在class属性,则在原有class后添加一个空格和新的class名称;如果不存在,则...

    原生javascript实现addClass,removeClass,hasClass函数

    这个函数的目的是给指定的DOM元素添加一个类名。在实现的时候,我们首先需要检查这个元素是否已经包含了这个类名。如果已经包含,则不重复添加;如果没有包含,我们则需要将类名添加到元素的className属性的末尾。...

    Jquery 常用

    - 删除元素:`$("#target").remove()` 移除目标元素。 - 查找子元素:`$("parent").children()` 获取所有直接子元素。 - 插入元素:`$("before").before($("#insert"))` 在 before 元素前插入 insert 元素。 3. ...

    jqueryUi基础教程

    AddClass 方法用于向匹配的元素添加一个或多个类名,从而应用相应的 CSS 样式。 **依赖的 JS 库:** - jQuery 核心库 **调用方法:** ```javascript $("#element").addClass("className"); ``` **参数说明:** -...

    jQuery 文档操作方法

    addClass() 方法用于向匹配的元素添加指定的类名。该方法可以将一个或多个类名添加到元素上,多个类名之间用空格分隔。 语法:`$(selector).addClass(className)` 参数: * `selector`:选择器,用于选择要添加...

    JQuery操作元素的css样式

    1. addClass()方法用于向指定元素添加一个新的CSS类。例如,如果有一个具有ID为target的元素,我们可以通过以下代码向其添加名为newClass的CSS类: ```javascript $("#target").addClass("newClass"); ``` 这里的#...

    高亮闪烁某个元素的js脚本

    1. **选择元素**:首先需要能够通过ID或者其他方式选中页面上的目标元素。 2. **添加样式**:接着为选中的元素动态地添加或删除特定的CSS类,以改变其外观。 3. **定时切换**:最后通过设置定时器来控制样式的变化...

    操作简单的滚动的数字.rar

    例如,`$("#elementId")` 可以选取ID为"elementId"的元素,`.addClass("className")` 则可以向选定元素添加CSS类。 在描述中的“滚动的数字”效果,通常指的是数字会以动态的方式逐个增加或减少,给人一种视觉上的...

    jqueryair jquery air

    例如,要为某个元素添加点击事件,可以这样做: ```javascript $("#myButton").click(function() { alert("Button clicked!"); }); ``` 当用户点击 ID 为 `myButton` 的元素时,会弹出警告框显示 "Button clicked...

    jq影院座位布局实现

    例如,我们可以使用jQuery的`$("#elementID")`来选取特定ID的元素,`.on('click', function() {...})`监听点击事件,`.addClass('className')`添加样式类,等等。 前端开发中的一个重要概念是布局。在这个影院座位...

    jquery.zip

    `.attr()`和`.removeAttr()`用于设置或移除元素属性,`.addClass()`和`.removeClass()`则用于添加或移除类名。此外,`.html()`, `.text()`, `.val()`分别用于获取或设置元素的HTML内容、文本内容和表单元素的值。 ...

    jquery-1.8.3.js.zip

    例如,`$("#elementID")`用于选取ID为"elementID"的元素,`$(".className")`则选取所有类名为"className"的元素。 2. **链式操作**:jQuery对象支持链式调用,允许开发者在一个语句中执行多个操作。例如,`$("p")....

    jQuery实现的输入框获得焦点时改变样式效果(默认是灰色).zip

    例如,`$("#elementID")`会选择ID为`elementID`的元素,`$(".className")`会选择所有class名为`className`的元素。在本项目中,我们可能关注的是`input[type="text"]`选择器,它将选中所有的文本输入框。 接下来,...

    读JavaScript DOM编程艺术笔记

    `addClass`函数用于向元素添加一个新的CSS类或多个类。它首先检查目标元素是否已有`className`属性,如果没有,则直接赋值。如果已有,需要创建一个新的类名字符串,通过连接已有的类名和新的类名,然后赋值给元素的...

    jQuery 中文文档

    例如,`$('.classname').addClass('newclass')` 可以为所有类名为 `classname` 的元素添加一个新的类 `newclass`。 - **AJAX支持**:jQuery内置了强大的AJAX功能,可以方便地发起异步请求,并处理服务器端返回的...

    jquery-下拉多选.tar.gz

    例如,`$(selector).addClass('className')`和`$(selector).removeClass('className')`用于添加或移除类名,从而改变元素的显示效果。 4. **动画效果**:jQuery的动画功能如`fadeIn()`, `slideToggle()`等,可以为...

    通过DOM脚本去设置样式信息

    例如,我们可能想给所有`hl`元素后面的一个元素添加特定的样式。CSS当前无法直接根据这样的逻辑进行选择,但通过DOM可以轻松实现这一目标。 在JavaScript中,我们可以使用`getElementsByTagName()`方法获取所有指定...

Global site tag (gtag.js) - Google Analytics