js 操作属性,操作内容,

disable=“disable” 让按钮变得不可选

先建一个按钮,让class = ’btn‘

然后,

添加,修改属性

document.getElementsByClassName('btn')[0].onclick = function(){

   this.setAttribute('disabled'='disabled'); 第一个空填要修改的属性,第二个填要属性的值

}

如果属性里没有要添加的属性,就会把填写的属性添加进去,如果有就会覆盖。

<body>
    <input type="button" class="a1" id="b1" value="按钮"></input>
</body>
</html>
<script type="text/javascript">
    document.getElementsByClassName('a1')[0].onclick = function () {
        this.setAttribute('disabled','disabled');
    }

</script>   //点击一下按钮,按钮就变成不可选择

 获取这个属性的值,如果没有就返回null。

this.getAttribute('属性')  

<body>
    <input type="button" class="a1" id="b1" value="按钮" disabled="disabled" ></input>
    <input type="button" class="a1" id="b2" value="按钮2" aa="1111"></input>
</body>
</html>
<script type="text/javascript">
    document.getElementsByClassName('a1')[1].onclick = function () {
        var gg = this.getAttribute('aa');
        alert(gg);        
        }
</script>  //获取按钮2里面属性aa的值

 

this.removeAttribute('属性名')   删除属性

<body>
    <input type="button" class="a1" id="b1" value="按钮" disabled="disabled"></input>
    <input type="button" class="a1" id="b2" value="按钮2" ></input>
</body>
</html>
<script type="text/javascript">
    document.getElementsByClassName('a1')[1].onclick = function () {
        document.getElementById('b1').removeAttribute('disabled');
        }
    

</script>  //点击按钮2就会删除按钮1的disabled属性

 操作内容:

普通元素.innerHTML = "值"; 会把值里面的标记执行(如果有换行之类的就会换行等····)

普通元素.innerText = "值"; 将值原封不动的展示出来,即使里面有标记也连标记一起打出来

var s = 普通元素.innerHTML; 会把此元素下的所有文本及标记代码取出来。
var s = 普通元素.innerText; 值会把此元素下的文本取出来,标记不予理会。

这中作用下对值中代码的态度和上边的完全反过来;

 

表单元素 - 只能使用value 来取值赋值
表单元素.value = "值";
var s = 表单元素.value;


操作相关元素:

注意:哥哥级,弟弟级,后辈级注意回车和空格

document.createElement('标记名'); - 动态创建dom对象
a.appendChild(对象); 往a标记中添加一个子级元素,添加的位置是最末尾

 

posted @ 2017-04-04 20:34  超级芒果  阅读(394)  评论(0编辑  收藏  举报