您的位置:首页 > Web前端 > JavaScript

JS和JQ得到标签的属性和标签内的值

2017-09-02 12:57 363 查看
js获取html的span标签的值

<span id="testid">aaaa</span>


方法一:.innerText

var x1 = document.getElementById("testid").innerText;
alert("x1="+x1);


方法二:.innerHTML

var x2 = document.getElementById("testid").innerHTML;
alert("x2="+x2);


js获取html的标签属性

<a id="link" href="www.baidu.com" title="测试" blogname="前端开发">Web开发</a>


var ka=document.getElementByI d("link");
alert(ka.getAttribute("id"));
alert(ka.id);


两种方法都能弹出a标签的ID属性,但从各浏览器兼容上来说用ka.id的方式更好,但对于自定义属性blogname,则就要用getAttribute()来实现了,如:

alert(ka.getAttribute("blogname")); //前端开发


JQ

1.得到标签内的内容分为:Text内容和HTML内容

<p id="test">这是段落中的<b>粗体</b>文本。</p>
<button id="btn1">显示文本</button>
<button id="btn2">显示 HTML</button>

<script>
$(document).ready(function(){
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
});
</script>


2.获取输入框内的值

<p>姓名:<input type="text" id="test"></p>

$("#test").val();


3.获取标签内属性值

<a href="这是一个测试" id="w3s">test</a>

$("#w3s").attr("href");
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html javascript