Java教程

webAPI编程-01

本文主要是介绍webAPI编程-01,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

1.获取元素

  • 通过HTML5新增的方法获取
document,getElementsByClassName('类名');  //根据类名返回元素对象集合
document.querySelector('选择器'); //根据指定选择器返回第一个元素对象(里面的选择器需要加符号,例如.box,#nav)
document.querySelectorAll('选择器'); //根据指定选择器返回所有元素对象集合
  • 获取特殊元素(body,html)

    • 获取body元素

      • document.body  //返回body元素对象
        
    • 获取html元素

      • document.documentElement //返回html元素对象
        

2.事件处理

  • 执行事件步骤

    • 1.获取事件源

      • var div = document.querySelector('div');
        
    • 2.绑定事件 注册事件

      • div.onclick
    • 3.添加事件处理程序

      • div.onclick = function() {
            console.log('xxxxxx')
        }
        

3.操作元素

  • 改变元素内容

    • 1.element.innerText //从起始位置到终止位置的内容,但它不识别html标签,同时空格和换行也会去掉
    • 2.element.innerHTML //起始位置到终止位置的全部内容,包括html标签,同时保留空格和换行
  • 表单属性设置

    • 表单里面的值,文字内容通过 value来修改

    • 如果想要某个表单被禁用,不能再点击,通过 disabled

      • this.disabled = true;
        
      • this指向的是时间函数的调用者

  • 样式属性操作

    • 1.element.style //行内样式操作

    • 2.element.className //类名样式操作

    • JS里面的样式采取驼峰命名法,比如:frontSize,backgroundColor

    • JS修改style样式操作,产生的是行内样式

    • 如果样式修改较多,采取类名样式操作更改元素样式

    • className会直接更改元素的类名,会覆盖原先的类名,如果想要保留原先的类名,用多类名选择器

      • this.className = '原先的 修改的';
        

这篇关于webAPI编程-01的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!