jQuery_2操作dom元素

<script type="text/javascript">
$(function(){
    $("#a1").attr("href","http://www.xxx.com");//设置a标记中的href属性
    var $url = $("#a1").attr("href");//获取a标记中的href属性
    $("#tip").html($url);
})
$(function(){//删除a标记中的href属性
    $("#a1").removeAttr("href");
})
</script>
...省略代码
 
<h3>attr()方法设置元素属性</h3>
<a data="http://www.hxxxz.com" id="a1">点我就变</a>
<div>改变后的地址：<span id="tip"></span></div>
...省略代码

<script type="text/javascript">
$(function(){ //增加表单中所有属性为可用的元素类别
    var $strHtml = $("#divShow").html();//获取HTML内容
    var $strText = $("#divShow").text();//获取文本内容
    $("#divHtml").html($strHtml);//设置HTML内容
    $("#divText").text($strText);//设置文本内容
})
</script>
...省略代码
<div id="divShow">**_几天不见你又瘦了_**</div>
<div id="divHtml"></div>
<div id="divText"></div>
 

<style type="text/css">
    body{font-size:15px;text-align:center}
    div{border:solid 1px #666;
        padding:5px;width:220px;margin:5px}
    .blue{background-color:blue}
</style>
<script type="text/javascript">
$(function(){ //增加表单中所有属性为可用的元素类别
    $("#content0").css("background-color","red");
    $("#content1").addClass("blue");
    $("#rem").click(function(){//click点击事件我们将在后面介绍到。
        $("#content1").removeClass("blue");
    })
})
</script>
...省略代码
 
### css()方法设置元素样式
 
<div id="content0">我穿了一件红色外衣</div>
<div id="content1">我穿了一件红色外衣</div>
<div><button id="rem">脱下蓝色的外衣</button></div>

<script type="text/javascript">
$(function(){ //增加表单中所有属性为可用的元素类别
    var $content = "**我是append()方法追加的内容**";
    var $contentTo = "**我是appendTo()方法追加的内容**";
    var $before = "**我是before()方法追加到前面的内容**";
    var $after = "**我是before()方法追加到后面的内容**";
    $("#id1").append($content);
    $($contentTo).appendTo("#id2");
    $("#id3").before($before);
    $("#id4").after($after);
})
</script>
...省略代码
    <p id="id1">append()追加内容：</p>
    <p id="id2">appendTo()追加内容：</p>
    <p id="id3">before()追加到前面</p>
    <p id="id4">after()追加到后面</p>