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

js动态添加classname

 
阅读更多

js动态添加classname

 

今天无疑在qq拍拍源码上看到一串这样的代码可以动态添加classname觉得不错就抄了下来

<script type="text/javascript">
window.onload = function () {
 var ulBox = document.getElementById("content");
 var list = ulBox.getElementsByTagName("li");
 for (var i=0; i<list.length; i++) {
  list[i].onmouseover=function() {
   this.className="hover";
  }
  list[i].onmouseout=function() {
   this.className="";
  }
 }
}
</script>

 

0
1
分享到:
评论

相关推荐

    Javascript 检测、添加、移除样式(className)函数代码

    代码如下: [removed] // 说明:添加、移除、检测 className function hasClass(element, className) { var reg = new RegExp(‘(\\s|^)’+className+'(\\s|$)’); return element.className.match(reg); } function ...

    详解原生JS动态添加和删除类

    由于需要, 给按钮组监听点击事件(要求用事件委托),当...1.通过类名, 获取类名: el.className, 赋值: el.className = “className” 会覆盖掉原来的类 2.通过属性,获取类名: el.getAttribute(“class”); 赋值:

    基于JavaScript实现类名的添加与移除

    方法1:使用className属性; 方法2:使用classList API; //用于匹配类名存在与否 function reg(name){ return new RegExp('(^|\\s)'+name+'(\\s+|$)'); } //hasClass addClass removeClass toogleClass var ...

    原生js实现class的添加和删除简单代码

    elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") ); }; function addClass( elements,cName ){ if( !hasClass( elements,cName ) ){ elements.className += " " + cName; }; }; function ...

    babel-plugin-jsx-classnames:babel插件,用于自动将`classnames()`添加到`className`属性中

    babel插件,用于自动将classnames()添加到className属性。 转换 &lt; div xss=removed&gt; &lt; / div &gt; 至 &lt; div xss=removed&gt; &lt; / div &gt; 为什么 类名 在React中,当您需要有条件地呈现className时,可以编写如下...

    原生js封装添加class,删除class的实例

    一、添加class function addClass(ele,cName) { var arr = ele.className.split(' ').concat(cName.split(" ")); for(var i=0;i;k&gt;i;k--){ (arr[k]==="")&&arr.splice(k,1); (arr[i]===arr[k])&&arr.splice(k,1...

    JS添加或修改控件的样式(Class)实现方法

    使用js 给页面组件添加class 或者删除class,以及使用jquery的方式添加或修改。 &lt;input id=txtBianCeng type=text /&gt; .lezhu99 { color:#cc0000; } 添加或修改样式(Class) document.getElementById...

    jQuery EasyInsert动态添加input、select、自定义html插件

    内容索引:脚本资源,jQuery,Select,jQuery插件 jQuery 动态添加input、select、自定义html示例的下载,已做成了新的插件,名字好像叫jquery.EasyInsert,示例文件已打包进压缩包。可以同时添加两个(或更多),name...

    jquery.corner.js最新版本【2.9】

    操作步骤:引入jquery-1.4.2.min.js(1.3以上版本就可以了)和jquery.corner.js 在script区域写入语法【打开官方网站,在每个样式的图片上的语法,注意this代表当前对象标签,换句话说,你可以把this换成一个其他...

    JavaScript详解(第2版)

     14.11.4 className属性   14.11.5 下拉菜单和提示框   14.12 应知应会   练习   第15章 W3C DOM与JavaScript   15.1 W3C DOM   15.2 理解DOM节点   15.3 节点   15.3.1 父节点和子节点...

    dom-add-class:使用classList添加类(如果存在)或使用className添加类(如果不存在)

    dom-add类将类添加到给定元素或元素集安装npm i --save dom-add-class用法var addClass = require ( 'dom-add-class' ) ;var sektor = require ( 'sektor' ) ;var boxes = sektor ( '.box' ) ;// add several ...

    [JavaScript.DOM高级程序设计](加)桑贝斯.扫描版.part1.rar

     第5章 动态修改样式和层叠样式表   5.1 W3CDOM2样式规范   5.1.1 CSSStyleSheet对象   5.1.2 CSSStyleRule对象   5.1.3 CSSStyleDeclaration对象   5.1.4 支持的匮乏   5.2 当DOM 脚本遇到...

    alert.js jQuery兼容电脑手机端弹出层插件.zip

    "className" : '', //添加类名 'position' : 'fixed', //定位方式 'animateType' : 'scale', 'modal' : false, //是否存在蒙层 'isModalClose' : false, //点击蒙层是否关闭 'bodyScroll' : false, //是否关闭...

    js实现class样式的修改、添加及删除的方法

    主要介绍了js实现class样式的修改、添加及删除的方法,主要通过修改标签的className来实现这一功能,非常具有实用价值,需要的朋友可以参考下

    Javascript数组操作高级心得整理

     使用[removed]调用外部的JavaScript(.js文件) 4  如何与老浏览器打交道 4 (2) 把JavaScript代码放到HTML页面不同的位置 4  把JavaScript代码放到HTML&lt;body&gt;部分 4  把JavaScript代码放到HTML&lt;head...

    datagrid-row.js

    easyui-datagrid扩展 1.获取行号:根据行索引获取datagrid表格的真实行号。 2.获取选择的多行可排序:根据列名称升序排列。 3.行添加class:传入参数包括行索引与classname。

    chartist-plugin-vertical-line:Chartist.js 的简单插件,将在折线图中添加带有可选标签的垂直线

    这是 Chartist.js 的一个简单插件,它将在折线图中添加带有可选标签的垂直线。 请访问了解更多信息。 可用选项及其默认值 var defaultOptions = { position : undefined , label : undefined , className : '...

    babel-plugin-tailwind-rn:允许您使用className =“ w-full md

    React Native Tailwind CSS v2 当一个babel插件和react钩子有了一个婴儿时。 您最终会得到这个!... babel.config.js添加插件babel.config.js tailwind-rn例如, plugins: ['tailwind-rn'] 用法 Met

    oo.js:另一个面向对象的JS库

    JavaScript中的面向对象设计的这种实现是一个实验,因此尚不用于生产用途。 oo.js的基本目标是允许包和类的访问/构造更类似于“经典”的OO结构。 这意味着类和包是在隔离的范围内创建的,并且使用它们(通过require...

Global site tag (gtag.js) - Google Analytics