zoukankan      html  css  js  c++  java
  • JS加强学习-DOM学习02

    4. 获得或设置页面文本内容的方式

    innerText

    innerHTML

    textContent

    区别:

    4.1 获取页面文本内容:

    innerText只获取标签间的文本信息,不包括其中的标签,而innerHTML是获得标签之间的所有内容包括标签,而且有些浏览器会将获取的内容原样输出,innerHTML是所有浏览器都支持,没有兼容性的问题,而innerText是IE8及早期的IE浏览器支持的,老版本火狐浏览器只支持textContent不支持innerText。

    4.2 设置文本内容:

    innerText会原样输出,里面即使有标签也渲染不出来,会将标签转义成文本。

    innerTHML是可以把字符串中的标签按HTML的标签原样的标签格式渲染呈现出来。

    4.3 兼容性问题:

    在讨论innerText与innerHTML之间的区别时,会遇到浏览器不兼容的情况,这就是兼容性问题,本质是看浏览器是否支持当前对象的属性或是方法,如果支持就说明是兼容,如果不支持,就说明不兼容。而在写代码时就需要考虑到用户的多版本浏览器的兼容性,我们常会在代码中写一段用于兼容各浏览器的代码。主要原则就是判断各种不同浏览器是否适用某些对象的属性和方法。

    5. 常用事件

    onclick:鼠标单击对象时触发

    ondblclick:鼠标双击对象时触发

    onkeyup:按下并释放键盘上的一个键时触发

    onchange:文本内容或下来菜单中的选项发生改变时触发

    onfocus:获得焦点,表示文本框等对象获得鼠标光标进入点击时触发

    onblur:失去焦点,表示文本框等对象失去鼠标光标,鼠标光标点击在别处后触发

    onmouseover:鼠标停留在图片等对象的上方时触发

    onmouseout:鼠标离开图片等对象所在的区域时触发

    onload:在页面或图像加载完成后触发

    onunload:用户退出或关闭网页时触发

    onsubmit:表单提交时触发

    onreset:表单重置时触发

    6.自定义属性

    6.1 可以使用行内式的方式给标签直接添加属性,例如下面的num属性:

    <input type="text" class="ip" id="txt" value="123" aa="456"/>

    这种方式设置的自定义的属性无法通过“事件源.属性”的方式获取到设置的值,可以通过txt.getAttribute("num")的方式来获取属性值。

    6.2 还可以通过 JS来设置自定义属性

    txt.mm = "258";  // 是可以通过 JS来设置自定义属性的

    6.3 对象方式来设置或删除标签属性

    txt.setAttribute("lll","7899");  // 可以通过setAttribute来设置对象的属性。

    txt.className = "";  // 将属性值清空,但是属性名还存在标签中。

    txt.removeAttribute("class"); // 彻底删除标签的属性,将属性名也删除。

  • 相关阅读:
    sql基础资料
    monkeyrunner自动化测试
    monkey命令
    加密类
    程序生成SiteMapPath文件
    Asp.net 后台调用js方法(转)
    C# 文件粉碎
    【乱搞】【AOJ-149】简易版最长序列
    【乱搞】【AOJ-59】09年3月选拔赛第4题
    关于java 线程池 ThreadPoolExceutor 之 TestDemo
  • 原文地址:https://www.cnblogs.com/chendu/p/5745112.html
Copyright © 2011-2022 走看看