html：

<HTML>

   <head>
      <meta http-equiv="content-type" content="text/html" />
      <meta charset="utf-8" />
      <title></title>
      <!--引入jquery库-->
      <script type="text/javascript" src="js/jquery-2.2.2.min.js"></script>
      <script type="text/javascript">

         function setColorByJs(){
//          获取input元素集合
            var aInput=document.getElementsByTagName("input");
            for(var i=0;i<aInput.length;i++){
               aInput[i].style.background="#efefef";

            }

            var aTextarea=document.getElementsByTagName("textarea");
            for(var i=0;i<aTextarea.length;i++){
               aTextarea[i].style.background="#efefef";
            }
         }

//       :input表示选择表单中的input,select,textarea,button元素，input仅仅选择input元素。
         function setColorByjQuery(){
            $(":input").css("background","#efefef");
         }
      </script>
   </head>

   <body>
      <!--表单元素-->
      <form action="" id="form">
         <fieldset>
            <label><span>姓名：</span><input type="text"/></label><br />
            <label><span>邮件：</span><input type="text"/></label>
            <div class="wrapper"><span>留言：</span><textarea></textarea></div>
         </fieldset>
      </form>

      <!--操作按钮-->
      <div class="wrapper">
         <a href="#" class="button" onclick="setColorByJs()">js更改表单颜色</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
         <a href="#" class="button" onclick="setColorByjQuery()">jquery更改表单颜色</a>
      </div>

   </body>

</HTML>

result：

　　初始：

aaarticlea/png;base64,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" alt="" />

　　点击任一按钮之后：

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA1YAAACeCAIAAAC+bQx4AAAINElEQVR4nO3dQZLaRhSAYc7he2U/B/BJPDfwxt7mCMNqTsSsvSKLVCiilpqnRkJSv++rqRQIIeS4q/p3g4bTFQCAZE5bnwAAAK8mAQEA0pGAAADpSEAAgHQkIABAOuMJ+B0AgI68v7+HEvATAIAu/Pr16/PzM5qATcuKAADsS5l2EhAAoHMSEAAgHQkIAJCOBAQASEcCAgCk038C/iS98/m89TAEgH1ZMQFPp5FDjW5s2Cdu6/xgY+fz+XK5LDiiAKADWRLwi6wul4sEBICBFyXg7fbDvDuNmfW6AxIwOQkIAKV9JWDzwmGFBExOAgJAafkEHF3Di6zt3fYsNz5DAiYnAQGgtNYq4GDZr74KOCjC+LvGERIwOQkIAKVXJOBo3j187lIXhUjA5CQgAJRetApYbg8+/XkSMDkJCACl3SXg85cAD0jA5CQgAJRWScCy/4KXg1SM7hw5GQmYnAQEgNK6q4BTl/0OttxfOFw5WvmsyJlIwOQkIACU9vXtIPEEjJOAyUlAAChtvwoYedQqIM0kIACU1v0s4HXm5SASkMVJQAAorfLtIOWWWRd5RPaMk4DJSUAAKK34WcAGPgvI4iQgAJT2lYBrkIDJSUAAKElAOicBAaCUIgE/Pj4u5Lb1MASAfek/AfUfFwkIAP/XfwL+JL3z+bz1MASAfVk3AedeyTv3V0lHbJ0fbOx8PlsFBICBlybgw1/1t14Cbn1NApvxRjAAlF6dgFMPDTaWN5pJwOQkIACU1vqCuNGv96iH3WggSkCeJAEBoLTudwQPbsxKwKW+I04CJicBAaC0QQJO9d9oIFoF5EkSEABKe1kFlICsRAICQGkXCVhZI5SAPEkCAkBpm8tBrtOZWB4q+KJTJGByEhAAStusAl4n3gu+TuRjeUVI/AIRCZicBASA0u4SMLLxKgEJk4AAUHp1AtYvCg5unEUCJicBAaC0l18KM7XdKiBPkoAAUNrscpDRZwU3XiUgYRIQAErrrgIOtiyYgHESMDkJCAClVRJwigTk9SQgAJRemoCbkIDJSUAAKElAOicBAaCUIgE/Pj4u5Lb1MASAfek/AfUfFwkIAP/XfwL+Te+2HmIAcDwpEnDrT6OxIgkIAA0kIMcmAQGggQTk2CQgADSQgBybBASABhKQY5OAANBAAnJsEhAAGkhAjk0CAkADCcixSUAAaCABOTYJCAANJCDHJgEBoIEE5NgkIAA0kIAcmwQEgAYSkGOTgADQQAJybBIQABpIQI5NAgJAAwnIsUlAAGggATk2CQgADSQgxyYBAaCBBOTYJCAANFg9AU+n0+k0fszKUxpeaIoE7JsEBIAGqyTg6c7oxodduGAFSsC+SUAAaLBWAj7cfrtdpmFF8ATuScC+SUAAaLBuAg6ibTQB1yYB+yYBAaDB6quAkdurkoB9k4AA0GDFBLy9dXv/3/LubePibwH/SwL26u3t7UsCAkCTFS8HGWyp3F2VBOzS29vbnz9/viQgADTxewE5nlv/fUlAAGiyVgLOfWPXG8EE3ffflwQEgCYrJmD8boN4F0rAntz3n88CAkAzCchhDPrPZwEBoJk3gjmG0f77koAA0GQvq4D1yJtKxsiZSMC+SUAAaJAiAelbZBgAAPf6fyMYAICBF60CPnx07v4AADTr/1dDAwAwIAEBANKRgAAA6UhAAIB0JCAAQDoSEAAgHQkIAJCOBAQASEcCAgCkIwEBANKRgAAA6cxIwN+/f38HAKALoQT88ePHJwAAHXmcgAAAdEwCAgCkIwEBANKRgAAA6UhAAIB0JCAAQDoSEAAgHQkIAJCOBAQASEcCAgCkIwEBANKRgAAA6UhAAIB0JCAAQDoSEAAgHQkIAJCOBAQASGdHCfjXt/cF95zaZ+72J0+DtIxnAPbs2QT869t7/OfhoeIv2rZb/Yn3j0bO35TZH+MZgCRWWQWszCVT89Csp8Tn48EsGD9+27NMol0yngHoTy0Bm+eAhvWPWdNPZAFm1vw6NUdGZuJZJ0bFbpvDeAagP8skYNuSxvW/OWawQ2RGnLVD5PjlmTSso9TPirr9JKDxHDkrAA5tmTeCG6ao+4ce7v/MKkjk7ugBR6fJ20NticAhGM/GM0D3tk/AyvwUfLmpwwantKmXvj+xuXNw/fTYOeN51ukBcESTCTg1u4xOPHOnqPKhxafMhruj202Zr1FZABssZZUDb2rnwWGnblfuGs+R0wPgiB6sAlZmsuBDD+/Wj/ZwMp5K0rnnU06cpszXi4yxWcVzuz3191t/rYa79aMZzwDsRHsCTu029+5ge32+iexzfckbZ/HjExfpnsr2YELFj9lwd7DdeAZgn2Yk4HXsjbZy+6wpqtweDM1gm0Z2qHdAZNWEpTyZgJHDBo9pPAPQt3kJWHkoPodFpvnRZ1WmtLq5KzHlZNkwZZpWG2ySgKOPGs+zXhSAw1nms4D3W4JrGLOmwKmHRrfEfx7+ueKvO3XOzBL5d8VgY/zvceoVm5fxBrsZzwAcyLwELOebcv/IlFmfhB7O8VM7RP4U9Ufnrjw1vyij6g1UbrwWI6TsofqgfTg2jOf4PgAcyEgCBpdPymeV8+7Ung1bbhunHqqv9EQeqs+L5d3gqgx1wfG20v/PyD9mjGfjGaA/wwSMzAR+4j+b/KUeyOZ/QX5m/Ww9XgBYzDLfDgIAwIFIQACAdCQgAEA6EhAAIB0JCACQjgQEAEhHAgIApCMBAQDSkYAAAOlIQACAdCQgAEA6EhAAIB0JCACQjgQEAEhHAgIApCMBAQDSkYAAAOlIQACAdCQgAEA6EhAAIJ1/AHQIEyIdbJ82AAAAAElFTkSuQmCC" alt="" />

js和jquery修改背景颜色的区别的更多相关文章

  1. html根据下拉框选中的值修改背景颜色

    错误的写法 <!doctype html><html><head><meta charset="utf-8"><title&g ...

  2. 小程序开发-iView app的NoticeBar 通告栏修改背景颜色

    NoticeBar 通告栏 这是个比较好用的组件,具体使用方法见 http://inmap.talkingdata.com/wx/index_prod.html#/components/notice- ...

  3. JS与jQuery中html-与-text方法的区别

    所有的实例均用下面的html <div id="id0"> <div id="id1"> 直接text <p> <sp ...

  4. Eclipse修改背景颜色（豆沙绿）

    操作界面默认颜色为白色.对于我们长期使用电脑编程的人来说,白色很刺激我们的眼睛,所以我经常会改变workspace的背景色,使眼睛舒服一些.设置方法如下: 1.打开window->Prefere ...

  5. 详解JS与Jquery获得的对象的区别与联系

    世上无难事只怕有心人,敲代码也一样只要你用心去搞懂一件事,即使一个小小的用法对你以后也会有很大的作用: 项目虽然赶得紧但是有些问题百度找完答案解决之后,也要自己梳理一遍做到心领神会!!!今天就直接来上 ...

  6. 利用HTML和JS制作隔行换背景颜色的表格

    1.源代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  7. 23【notepad++】修改背景颜色

    notepad++是一款功能丰富的编辑器,运行在windows平台上的编辑工具. 但它默认设置是白色背景,黑色文字,长时间看很刺眼.那么怎么设定成为暗色背景,亮色文字呢? 点击,设置->语言格式 ...

  8. pycharm -- 导入主题(theme) and 修改背景颜色（护眼色）

    前情提要 众所周知,随着python语言的不断流行,越来越多的程序员开始用python来开发自己的项目以及产品. pycharm作为一款流行的IDE,被越来越多的程序员所接受和使用. 尽管pychar ...

  9. Eclipse修改背景颜色

    windows->peferences->General->Editors->Text EditorAppearance color options:选择Background ...

随机推荐

  1. ubuntu配置机器学习环境（一） ubuntu安装

    第一部分:Ubuntu14.04安装 Step :安装Ubuntu Step 1.1:准备安装U盘 首先到官网下载Ubuntu的镜像,我使用的是Ubuntu 14.04.3的ISO. 然后使用Ultr ...

  2. spfa专题

    SPFA专题 1通往奥格瑞玛的道路 在艾泽拉斯,有n个城市.编号为1,2,3,...,n. 城市之间有m条双向的公路,连接着两个城市,从某个城市到另一个城市,会遭到联盟的攻击,进而损失一定的血量. 每 ...

  3. 自动化测试--封装getDriver的方法

    在自动化测试的时候,通常都会把最常用的功能封装起来,实现通用性. 该篇博客是实现了getDriver方法的封装. 第一次封装的时候,是使用的传参. @Parameters(value = {" ...

  4. GraphSAGE 代码解析(三) - aggregators.py

    原创文章-转载请注明出处哦.其他部分内容参见以下链接- GraphSAGE 代码解析(一) - unsupervised_train.py GraphSAGE 代码解析(二) - layers.py ...

  5. [PocketFlow]解决TensorFLow在COCO数据集上训练挂起无输出的bug

    1. 引言 因项目要求,需要在PocketFlow中添加一套PeleeNet-SSD和COCO的API,具体为在datasets文件夹下添加coco_dataset.py, 在nets下添加pelee ...

  6. c++调用Python基础功能

    c++调用Python首先安装Python,以win7为例,Python路径为:c:\Python35\,通过mingw编译c++代码.编写makefile文件,首先要添加包含路径:inc_path ...

  7. Introduction to TCP/IP

    目录 First Week DHCP 子网掩码 ip路由表 Second Week ipv4 ipv6 TCP和UDP Third Week NAT RPC FTP E-mail Fouth Week ...

  8. android自定义View绘制圆形头像与椭圆头像

    要实现这两种效果,需要自定义View,并且有两种实现方式.   第一种: public class BitmapShaders extends View {     private  BitmapSh ...

  9. 【转】给大家分享一下目前mlc颗粒的内存卡资料

    以下信息是LZ从其它论坛上找到的TF卡也是有讲究的,一分价钱一分货 dboy99 楼主 骚(6) #1楼 2015-8-5 14:49引用Micro SD卡也叫TF卡,作为手机扩展存储空间的唯一方式用 ...

  10. 我的python计划

    一直想学习一种脚本语言.现在主流的脚本语言,比较先接触的是python 刚开始了解了一下python,感觉挺适合自己的感觉,学习了一段时间,之中感觉,就好象C++一样,把面向对象和面向过程编程结合了起 ...