• js-API 02 获取元素和事件


    一,对表单的禁用
    document.getElementById("txt").disabled=true;
    
    二,阻止a链接的跳转
    return false
    1,<!--第一种写法:-->
    <a href="http://www.baidu.com" onclick="alert('11'); return false">百度</a>
    
    第一种缺点 代码不分离,不符合低耦合,高内聚的规范
    2,<!--第二种写法-->
    <script>
    function f1() {
    alert("哇塞,好漂亮哦");
    return false;
    }
    </script>
    <a href="http://www.baidu.com" onclick="return f1()">百度</a>
    
    第二种代码 缺点同上
    3,<!--第三种写法:-->
    <a href="http://www.baidu.com" id="ak">百度</a>
    <script>
    document.getElementById("ak").onclick=function () {
    alert("嘎嘎");
    return false;
    };
    </script>
    
    第三种  行为与结构分离 无缺点
    三,鼠标事件
    鼠标移入
    onmouseover
    属性在鼠标指针移动到元素上时触发
    鼠标移出
    事件名称  onmouseout
    属性在鼠标指针移动到元素外时触发。
    四,焦点事件
    获取焦点
    事件名称 onfoucus
    事件描述 onfocus 事件在对象获得焦点时发生,用于input
    失去焦点
    事件名称 onblur
    事件描述 onblur 事件会在对象失去焦点时发生,一般也用于表单输入框
    五,获取元素
    根据name名获取元素
    var inputs = document.getElementsByName('hobby');
    根据类名获取元素
    var mains = document.getElementsByClassName('main');
    根据选择器来获取元素
    QuerySelector 与 QuerySelectAll,其中第一个是返回一个匹配的元素,后面返回匹配到的所有元素
    六,innerText写内容
    innerText和textContent
    innerText和innerHTML的区别
    使用innerText主要是设置文本的,设置标签内容,是没有标签的效果的
    innerHTML是可以设置文本内容
    innerHTML主要的作用是在标签中设置新的html标签内容,是有标签效果的
    七,自定义属性
    获取属性
    Api名称  getAttribute("自定义属性的名字")
    设置属性
    setAttribute("属性的名字","属性的值");
    移除属性
    my$("dv").removeAttribute("属性名称");
  • 相关阅读:
    Java中关于时间日期格式保存到mysql的问题
    传输json数据到前台的时候,数据中包含日期数据
    字符串的分隔方法 split()
    实体类中用基本类型好,还是用包装类型
    Android中的task和stack
    在res文件下新建文件夹
    Android活动和碎片的生命周期及addToBackStack()方法
    draw9patch图片拉伸
    Android studio新建文件出现setContentView(R.layout.activity_main);中的R标红错误解决方法
    listview控件的使用
  • 原文地址:https://www.cnblogs.com/adylz111/p/13433633.html
Copyright © 2020-2023  润新知