js-API 获取元素的相关方式innerText和innerHTMl区别

对象可以直接. 其属性 拿到的数据是json队形那么就可以直接点属性 调用

成对标签 修改里面的内容 使用 innertext 不是成对比如input 私用value

按钮的排他功能

  1. 获取所有按钮

  2. 注册每个按钮点击事件

  3. 循环让没被点击的按钮的值为没被点击

  4. 被点击的按钮显示的value值为被点击了 this.value

    注意为事件注册点击事件,在浏览器加载完就已经注册完毕了,

点击按钮选中性别和兴趣 document.getElenmentById(‘btn’).οnclick=function() {

document.getElementById(‘rad’).checked = true;

输入款过的一些属性设置 true or false

selected也是 true或者false进行操作是否有选中

//注意这里使用true或者false

}

disabled 这个属性是禁用的

readonly这个文本框是只读

在js中操作dom是 不用calss关键字 应该使用className

网页的开关等效果 就是找到body元素 先判断它的类名 在选择添加其样式

阻止超链接默认跳转事件 直接a标签里加入 return false

获取时使用函数也可以 就是结果是return false

getElementsByTagName(‘a’); getElements记得加上s

获取li里面的a 直接一步到位不需要太复杂的嵌套

var aObj = my$('imagegallery').getElementsByTagName('a');

列表的高亮显示

为li注册鼠标的进入和离开事件

二维码得显示隐藏





    
    
    



    

通过name属性可以获取表单的元素

document.getElementsByName(‘name1’);

根据类样式的名字获取元素

document.getElementsByClassName();

其他获取元素方式 h5c3的方式

document.querySelector("#btn")

document.querySelectorAll(".cls")选择所有的,返回的是多个

这几种有的浏览器不支持

div的高亮

注意设置高亮出现 鼠标经过的时候抖动 这时需要给每个div提前加上一个

border 高亮的其实就是加上border

搜索框 的失去焦点和获取焦点

onblur 和 onfocus 小写的


    
    

验证文本框密码的长度

直接获取value 通过value.length进行匹配

####封装innerText和textContent

有的浏览器支持有的不支持

//设置标签中的文本内容,应该使用textContent属性,谷歌,火狐支持,IE8不支持
//设置标签中的文本内容,应该使用innerText属性,谷歌,火狐,IE8都支持

一个是设置标签的文本内容

一个是获取标签里面的文本内容

封装兼容代码 使用

if (typeof element.innerText == "undefined)来进行 判断

function settext(element, text) {
        if (typeof element.innerText == "undefined") {
            element.textContent = text;
        } else {
            element.innerText = text;
        }
    }
    my$('btn').onclick = function() {
        var dvObj = my$("dv");
        settext(dvObj, "牛逼了");
    }

innerHTML和innerText的区别

  • 总结:如果使用innerText主要是设置文本的,设置标签内容,是没有标签的效果的
  • 总结:innerHTML是可以设置文本内容
  • 总结:innerHTML主要的作用是在标签中设置新的html标签内容,是有标签效果的
  • 总结:想要设置标签内容,使用innerHTML,想要设置文本内容,innerText或者textContent,或者innerHTML,推荐用innerHTML

​ 使用innerHTML没有兼容问题使用innertext有兼容的问题

获取的时候:
  • innerText可以获取标签中间的文本内容,但是标签中如果还有标签,那么最里面的标签的文本内容也能获取.—获取不到标签的,文本可以获取
  • innerHTML才是真正的获取标签中间的所有内容

自定义属性操作

在html自定义的属性 通过 alert(this.getAttribute(‘score’));

getAttribute进行获取

不能直接点属性进行操作

添加自定义属性

第一个参数 name 第二个参数属性值

list[i].setAttribute(“score, (i+1)*10”);

移除自定义属性

my$(“dv”).removeAttribute(“class”);

可以移除自定义和元素自带的属性

tab切换实现

removeAttribute用来移除类样式





    
    
    



    
体育 娱乐 新闻 综合
  • 我是体育模块
  • 我是娱乐模块
  • 我是新闻模块
  • 我是综合模块

按钮的排他功能

你可能感兴趣的:(js-API)