2014年5月16日金曜日

jQuery HTML 要素名や属性名を指定して取得する

jQuery オブジェクトとして HTML 要素の名前を指定することで DOM 上の HTML 要素を簡単に取得することができます。なお、この方法では DOM 上の該当する要素すべてを取得します。

構文:
$('要素名')




特定の属性を持つ要素のみを取得する場合、要素名の後に属性を指定します。

構文:
$('要素名:属性')


例:HTML の select タグの選択アイテムを取得する場合
<script type="text/javascript">
    function selectionChanged()
    {
        // すべての option 要素を取得
        var all = $('option');
        // 選択されている option 要素を取得
        var selected = $('option:selected');

        // 各要素の値を表示
        $(all ).each(
            function (e) {
                alert($(this).val());
            }
        );
        $(selected).each(
            function (e) {
                alert($(this).val());
            }
        );
    }
</script>
    
<body>
    <select multiple="multiple" onchange="selectionChanged()">
        <option>Item 1</option>
        <option selected="selected">Item 2</option>
        <option>Item 3</option>
        <option>Item 4</option>
        <option>Item 5</option>
    </select>
</body>

0 件のコメント:

コメントを投稿