jquery復習(四) – JAVA編程語言程序開發技術文章

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title></title>
<script type=”text/javascript” src=”lib/jquery-1.5.2.js”></script>
<style type=”text/css”>
.red {
    background-color: red;
}


.green {
    background: green;
}
</style>
<script type=”text/javascript”>
    $(function() {
        //取得第一個匹配元素的html內容。不能用於xml,但可以用於xhtml
        //alert($(“p”).html());
        //設置每個元素的 html內容。
        //$(“p[id=test2]”).html(“Hello World”);
        $(“p”).html(function(index, html) {
            return html + index;
        });
    });
</script>
</head>
<body>
    <p>
        <p>Hello</p>
    </p>
    <p id=”test2″>中華</p>
</body>
</html>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title></title>
<script type=”text/javascript” src=”lib/jquery-1.5.2.js”></script>
<style type=”text/css”>
.red {
    background-color: red;
}


.green {
    background: green;
}
</style>
<script type=”text/javascript”>
    $(function() {
        //對Html,xml都有效。
        //text()取得所有匹配元素的內容 ,包括子元素。
        //text()<b></b>轉化為實體。
        $(“p”).text(function(index, text) {
            return $(“p”).text() + text + index + “<b>我靠</b”;
        });
    });
</script>
</head>
<body>
    <p>
        <b>Test</b> Paragraph.
    </p>
    <p>Paraparagraph</p>
    <p>我是p:</p>
</body>
</html>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title></title>
<script type=”text/javascript” src=”lib/jquery-1.5.2.js”></script>
<style type=”text/css”>
.red {
    background-color: red;
}


.green {
    background: green;
}
</style>
<script type=”text/javascript”>
    $(function() {
        //獲得單個select 的值和多選select的值。
        /*
        $(“p”).append(
                “<b>Single:</b> ” + $(“#single”).val() + ” <b>Multiple:</b> “
                        + $(“#multiple”).val().join(“, “));
       
         */


        //    alert($(“input”).val());
        //設置文本框 的值。
        $(“input[id]”).val(“hello World”);


        $(“#single”).val(“Single2”);
        $(“#multiple”).val([ “Multiple”, “Multiple3” ]);
        $(“input”).val([ “check2”, “radio1” ]);


        $(“:text.items”).val(function() {
            return this.value + ” ” + this.className;
        });
    });
</script>
</head>
<body>
    <p></p>
    <br />
    <select id=”single”>
        <option>Single</option>
        <option>Single2</option>
    </select>
    <select id=”multiple” multiple=”multiple”>
        <option selected=”selected”>Multiple</option>
        <option>Multiple2</option>
        <option selected=”selected”>Multiple3</option>
    </select>


    <input type=”text” value=”some text” />
    <input id=”test2″ type=”text” />
    <input type=”checkbox” value=”check1″ /> check1
    <input type=”checkbox” value=”check2″ /> check2
    <input type=”radio” value=”radio1″ /> radio1
    <input type=”radio” value=”radio2″ /> radio2


    <input type=”text” class=”items” />
</body>
</html>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<title></title>
<script type=”text/javascript” src=”lib/jquery-1.5.2.js”></script>
<style type=”text/css”>
.red {
    background-color: red;
}


.green {
    background: green;
}
</style>
<script type=”text/javascript”>
    $(function() {


        //想把dom文檔中元素副本加到其他元素上時很有用。
        //$(“b”).clone().prependTo(“p”);
        //clone(true),深copy
        $(“button”).click(function() {
            $(this).clone(true).insertAfter(this);
        });
    });
</script>
</head>
<body>
    <b>Hello</b>
    <p>, how are you?</p>
    <button>Clone Me!</button>
</body>
</html>
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html>
&

發佈留言