zoukankan      html  css  js  c++  java
  • BOM

             今天学了js的一些特效和属性原理,首先在<head></head>中建个IDdiv,那么他在js中就这么写格式:

         var d1=document.getElementById("d1");

          d1.innerHTML="";

         在这里学到了和以前有关的知识,比如style属性了,接下来就可以应用了,首先我们可以给字体添加大小,颜色,以及边框:

         d1.style="font-size:50px;"

          d1.style.color="red";

          d1.style.border="1px solid black;"

         alert(d1.style.width);

       说到选择器这个东西,有id选择器,就有class选择器,所以接下来就是class选择器:

         var d2 = document.getElementsByClassName("d2")[0];

          d2.innerHTML="ABCDEF";

         然后就是标签选择器以及innerHTML和innerTEXT的区别:

         var d3=document.getElementsByTagName("span")[0];

          d3.innerText="XYZ</br>IJK"

          期中innertext是把=后面的所有内容都变成文本输入进去,而html是能将标签读取,比如加入</br>他就会换行。

          在这里面有很多特效,特效代码前面要加on,比如onclick鼠标选定的时候,onmouseover鼠标一上去的时候,onmouseout,鼠标离开的时候。

          注册表很多时候下面有个你必须点同意条款才能进行下一步,那么那个是怎么做的呢,代码如下:

          

          <body>
          <input type="checkbox" id="ckb" /><label for="ckb">同 意</label>
          <input id="btn" type="button" value="下一步" disabled="disabled" />
          </body>

          <script>
          var ckb = document.getElementById("ckb");
          var btn = document.getElementById("btn");
          ckb.onchange = function(){
          var status = ckb.checked;
            if(status == true){
          btn.removeAttribute("disabled");
          }else{
          btn.setAttribute("disabled","disabled");
          }
          }
          </script>

          还有将一个text中的内容添加到下拉框中的:

        <body>
        <select id="slt" size="7" style=" 100px;">
        <option>abc</option>
        <option>123</option>
        </select>
        <input type="text" id="txt" />
        <input type="button" id="btn" value="添加" />
        </body>

        <script>
        var btn = document.getElementById("btn");
        var txt = document.getElementById("txt");
        var slt = document.getElementById("slt");

        btn.onclick = function(){
        // alert(txt.value);
        var opt = document.createElement("option");
        opt.innerText = txt.value;
        slt.appendChild(opt);
        txt.value = "";

        }.

  • 相关阅读:
    数据访问之注册审核(重点是审核!!!)常用于企业、公司、医院等网站---2017-05-04
    5个简约的网站---2017-05-03
    数据访问(租房子多条件查询)---2017-05-03
    数据访问之 批量删除 ---2017-05-03
    数据访问之查询数据 ---2017--05-02
    php部分--数组(包含指针思想遍历数组);
    php部分---面向对象静态、抽象类、oop接口、加载类、魔术方法、关键字。
    PHP部分---字符串处理(文中例子不断更新);
    php部分--面向对象三大特性-封装(另加连续调用的一个例子)、继承(重写、重载的例子)、多态;
    php部分---面向对象:定义、实例化、构造函数、析构函数;
  • 原文地址:https://www.cnblogs.com/yujiamin123/p/6881822.html
Copyright © 2011-2022 走看看