jquery獲取內容和屬性的方法_ZenDei技術網路在線

jquery獲取內容和屬性的方法

-Advertisement-

通過jquery如何捕獲文本內容和屬性？ text(),html(),val()及attr()。 attr()更具有普遍性，元素text屬性和表單value屬性，可以通過attr()操作。 ...

　　通過jquery如何捕獲文本內容和屬性？

　　text(),html(),val()及attr()。

　　attr()更具有普遍性，元素text屬性和表單value屬性，可以通過attr()操作。

<!DOCTYPE html>
<html>
<head>
    <title>jquey獲取內容和屬性</title>
    <script type="text/javascript" src="../jquery.min.js"></script>
    <script type="text/javascript">
        // jquery擁有可操作HTML元素和屬性的強大方法。

        // text()設置或返回所選元素的文本內容

        // $(function(){
        //     $('#btn1').click(function(){
        //         alert($('p').text());
        //     });
        //     $('#btn2').click(function(){
        //         alert($('p').html());
        //     })
        // })
        // html()設置或返回所選元素的內容（包括HTML標記）
        // 連同html標簽一起返回

        // val()設置或返回表單欄位的值
        // 獲得輸入欄位
        // $(function(){
        //     $('button').click(function(){
        //         alert('值:'+$('input').val());
        //     })
        // })

        // attr()獲取屬性值
        $(function(){
            $('button').click(function(){
                alert($('input').attr('value'));
            })
        })
        // 使用attr同樣可以代替val()，如此例，屬性value
        // 此方法是通過屬性改變
    </script>
</head>
<body>
<!--     <p>這是段落中的<b>粗體</b>文本。</p>
        <button id="btn1">顯示文本</button> -->
        <!-- <button id="btn2">顯示HTML</button> -->
        <p>名稱：<input type="text" name="" value="菜鳥教程"></p>
        <button>點擊顯示</button>
</body>
</html>

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

使用OCLint和Sonar對iOS代碼分析和質量管理

OCLint 是一個強大的靜態代碼分析工具，可以用來提高代碼質量，查找潛在的bug，主要針對c,c++和Objective-c的靜態分析。 Sonar 是一個用於代碼質量管理的開放平臺。通過插件機制，Sonar 可以集成不同的測試工具，代碼分析工具，以及持續集成工具。 1 brew install ...
Android帶有粘性頭部的ScrollView

前言，一天在點外賣的時候，註意到餓了麽列表頁的滑動效果不錯，但是覺得其中的手勢滑動還是挺複雜的，正好又碰到了在熟悉Touch事件的理解當中，所以就抽空對著餓了麽的列表頁面嘗試寫寫這個效果 1.先貼一個實現的效果圖邏輯是當外部的ScrollView沒有滑到底部的時候，往上滑動的時候，是滑動外部的Sc ...
小程式客服消息

看到很多小程式里，點客服，提示關註公眾號，比如製作器里這個功能，能夠自動引導關註公眾號，圖文體驗非常好，研究了小程式客服介面後，我們就自己把它做成一個工具了，方便小程式的運營人員。芝麻小客服體驗傳送門 http://xiaokefu.hotapp.cn 特點： (1)不需要開發，只需要在微信的小程 ...
Vue精簡版風格指南

[1]組件名稱 [2]組件相關 [3]prop [4]指令及特性 [5]屬性 [6]謹慎使用 ...
jQuery應用實例3：全選、二級聯動

全選：這裡是用JS實現的：http://www.cnblogs.com/xuyiqing/p/8378221.html 如果使用jQuery則會方便很多： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>全選和全不選</tit ...
[JS] 一個三位數的百位，十位，個位互換（從大到小，從小到大）

三位數的百位，十位，個位從大到小進行互相交換代碼，JS代碼如下。 ...
小劉同學的第三十七篇博文

在家裡，不去自習，效率比之前在學校圖書館差太多了。。。自己特別容易分神，而且不是很想學習，不是很想寫代碼。真的很惱火，為什麼大學里把高中三年養成的那麼好的自律給丟掉了，現在走神變得相當頻繁，也靜不下心來寫東西，真是，哎，不多說了，剩下的就寫進日記里吧，畢竟這裡是談技術的地方。在8點半左右完成了h ...
jQuery應用實例2：表格隔行換色

這裡是用JS實現的：http://www.cnblogs.com/xuyiqing/p/8376312.html 接下來利用上一篇提到的選擇器利用jQuery實現：發現原來多行代碼這裡只需要兩行： <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...