• JavaScript中的元素获取与操作


    js元素获取与操作

    可以使用内置对象document上的getElementById方法来获取页面上设置了id属性的元素,获取到的是一个html对象,然后将它赋值给一个变量,比如:

    <script type="text/javascript">
    
        var oDiv = document.getElementById('div1');
    
    </script>
    
    ....
    
    <div id="div1">这是一个div元素</div>
    

    上面的语句,如果把javascript写在元素的上面,就会出错,因为页面上从上往下加载执行的,javascript去页面上获取元素div1的时候,元素div1还没有加载,解决方法有两种:

    第一种方法:将javascript放到页面最下边

    ....
    
    
    <div id="div1">这是一个div元素</div>
    
    ....
    
    <script type="text/javascript">
    
        var oDiv = document.getElementById('div1');
    
    </script>
    </body>
    

    第二种方法:将javascript语句放到window.onload触发的函数里面,获取元素的语句会在页面加载完后才执行,就不会出错了。

    <script type="text/javascript">
    
        window.onload = function(){
            var oDiv = document.getElementById('div1');
        }
    
    </script>
    
    ....
    
    <div id="div1">这是一个div元素</div>
    

    样式操作

    标签对象.style.css属性名=“值” //改变标签对象的样式。

    示例:id.style.color=“red”;

    注意:属性名相当于变量名,所以css属性名中含有双拼词的(font-size)的减号要去掉,将后面的首字母大写。fontSize

    文本操作

    标签对象.innerHTML=“内容”;//在标签对象内放置指定内容

    表单中值的操作

    标签对象.value; //获取标签对象的value值

    标签对象.value=”值“;//设置标签对象的value值

  • 相关阅读:
    获取bootstrap table数据并封装 为json
    不自动切换eclipse视图
    over 分析函数之 lag() lead()
    oracle日期的处理
    表空间的创建
    分析函数 over用法 之row_number() runk_number
    oracle 序列
    Laravel 5
    使用hexo+github搭建免费个人博客详细教程
    windows7设置定时任务运行ThinkPHP框架程序
  • 原文地址:https://www.cnblogs.com/victorfengming/p/11930984.html
Copyright © 2020-2023  润新知