js与jquery之元素操作
js
1、innerHTML获取
a = document.getElementById("username").innerHTML;
取出元素的html内容,即元素的开始标签和结束标签之间的所有字符,类型为字符串。
<p name=‘username‘>12<span>123</span>3</p>
a = document.getElementById("username").innerHTML;
a的值为12<span>123</span>3
2、innerText获取
a = document.getElementById("username").innerText;
取出元素的文本内容,即元素的开始标签和结束标签之间的,除了嵌套的标签外所有的字符内容,类型为字符串。
<p name=‘username‘>12<span>123</span>3</p>
a = document.getElementById("username").innerText;
a的值为121233
3、获取属性
document.getElementById("username").attributes
document.getElementById("username").attributes[0]
document.getElementById("username").attributes[‘name‘]
返回元素的属性集合对象,通过下标获取
4、innerHTML设置
document.getElementById(‘a‘).innerHTML=‘<img src="https://shs3.b.qianxin.com/butian_public/f8595983366a88d39b1a65d669a823b7184cd19eef9be.jpg">‘
执行后,赋值内容中会解析html显示
5、innerText设置
document.getElementById(‘a‘).innerText=‘<img src="https://shs3.b.qianxin.com/butian_public/f8595983366a88d39b1a65d669a823b7184cd19eef9be.jpg">‘
执行后,赋值内容中不会解析html显示,而是直接作为文本显示
6、设置属性
document.getElementById(‘a‘).setAttribute(‘id‘,‘123‘)
jquery元素操作
jquery获取对象与js获取对象的类型存在差异,jquer获取的对象无法调用原生js的操作方法,而需要使用jquery自定义的操作方法。
//获取html内容
$("#a").html()
//设置html内容
$("#a").html(‘<a href="http://www.bubuko.com/123">abc</a>‘)
//获取text内容
$("#a").text()
//设置text内容
$("#a").text(‘<a href="http://www.bubuko.com/123">abc</a>‘)
//获取属性内容
$("#a").attr(‘checked‘)
//设置属性内容
$("#a").attr(‘checked‘,false)
//获取输入控件的value内容
$("#a").val()
//设置输入控件的value内容
$("#a").val(‘abcdef‘)
js与jquery之元素操作
原文:https://www.cnblogs.com/heibaimao123/p/16277512.html