jQuery —— DOM属性，值及内容操作

作者: sky丶星如雨 | 来源:发表于2017-07-08 18:46 被阅读0次

jQuery —— DOM属性，值及内容操作
JQuery学习——（3）JQueryHTML
jQuery HTML
jQuery HTML
jQuery HTML
jQuery 操作form表单
jQuery进阶
JavaScript之jQuery
jQuery操作及动画效果
jQuery操作及动画效果

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../jquery-1.11.3.min.js"></script>
    <script>
        $(function () {
            // 设置属性
            $("input").eq(0).click(function () {
                $(this).attr("title", "动态设置属性");
            });
            // 获取属性
            $("input").eq(1).click(function () {
                var attr = $("input").eq(0).attr("title");
                console.log(attr);
            });
            // 移除属性
            $("input").eq(2).click(function () {
                $("input").eq(0).removeAttr("title", "动态设置属性");
            });
            // 设置值
            $("input").eq(3).click(function () {
                $("#txt").val("动态设置的值");
            });
            // 获取值
            $("input").eq(4).click(function () {
                console.log($("#txt").val());
            });
            // 设置html内容
            $("input").eq(5).click(function () {
                $("div").html("<P>我是html内容</P>");
            });
            // 获取html内容
            $("input").eq(6).click(function () {
                console.log($("div").html());
            });
            // 设置文本内容
            $("input").eq(7).click(function () {
                $("div").text("动态创建文本内容");
            });
            // 获取文本内容
            $("input").eq(8).click(function () {
                console.log($("div").text());
            });

        })
    </script>
</head>
<body>
<input type="button" value="设置属性">
<input type="button" value="获取属性">
<input type="button" value="移除属性">
<input type="button" value="设置值">
<input type="button" value="获取值">
<input type="button" value="设置html内容">
<input type="button" value="获取html内容">
<input type="button" value="设置text内容">
<input type="button" value="获取text内容">
<div>
    <input type="text" id="txt">
</div>
</body>
</html>