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

JS和JQ中获取标签里的内容方法总结

2017-10-17 08:37 302 查看 
JQ获得内容 - text()、html() 以及 val()
三个简单实用的用于 DOM 操作的 jQuery 方法：
text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
val() - 设置或返回表单字段的值
参考:http://www.runoob.com/jquery/jquery-dom-get.html
1、获取input标签的值，方法：

根据input的name或者id获取其值，假如有：<input type='text' id='name' value=123>
JQ中获取方法：$("#name").val();
2、获取input标签的属性内容，方法：
如有：<input type='text' id='name' value=123 ind='1'>
要获取ind的值，方法：
$("#name").attr("ind");

3.把获取的JQ对象转成dom对象,用dom对象的方式获取
$("#name")[0].value;

=========================================================

JS获取内容的方法

<body>    <input type="button" name="" value="添加li">    <ul>      <li>春</li>      <li>夏</li>      <li>秋</li>    </ul>  </body>

<script type="text/javascript">
var li=document.getElementsByTagName('li); //先选中li标签
li[0].innerHTML;  //JS里获取里li标签里的文本内容的方法  春</script>--------------------------------------------------------------------------//1、获取input标签的值，方法：
 <input type="text" name="" value="abc123">

var ul=document.getElementsByTagName('input')[0];  //先选中input标签

方法一:  

var ul.value; //  获取input里的value值

方法二:

$("ul").val(); //把ul里的dom对象转成JQ对象,用JQ里的获取方法
//2、获取select 下option里标签的值，方法：
例:

<body>
    <p>
      <select id="con">
<option value="SF">顺丰</option>

      <option value="YTO">圆通</option>
      <option value="STO">申通</option>
      <option value="ZTO">中通</option>
      <option value="YD">韵达</option>
    </select>
</p>

</body>
<script type="text/javascript">


//获取select 下option里标签的值
var con = document.getElementById('con').value;
</script>




                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航