网页开发（十二）JQuery表格和页面整合

（4）操作样式

addClass

removeClass

hasClass

（5）值的操作

<div id='c1'>内容</div>

$("#c1").text                    获取文本内容

$("#c1").text("休息")        设置文本内容

<input typr='text'  id='c2'   />

$("#c2").val()                获取用户输入值

$("#c2").val("哈哈")      设置值

案例：动态创建数据

 可以达成的效果就是用户填写好后，点一次提交，下面就会出现用户的名字，如果想同时出现用户名与email，就需进行字符串的拼接，如下所示：

var dataString=username + "-"+ email;

（6）事件

通过JQuery绑定事件，可也进行批量绑定

<ul>

      <li>百度</li>

      <li>谷歌</li>

      <li>搜狗</li>

</ul>

<script>$("li").click(function() {

     //点击li时会自动执行这个函数；$(this)指当前你点击的是哪个标签

})

</script>

在JQuery中可以删除标签

<div id='c1'>内容</div>

$("#c1").remove();

因此我们也可以做到点击谁就删除谁的操作：

  $("li").click(function () {
          $(this).remove();
});

 假设有一张很大的图片，加载需要很长的时间，如果按照上述的代码写，就需要把图片加载完毕了才会执行到后面的$function，如果想当页面的框架加载完成后，就自动执行，可以写成以下样式：

<ul>
    <li>百度</li>
    <img src=""  alt="">
</ul>
<script>
    $(function () {
         // 当页面的框架加载完毕后，自动执行
        $("li").click(function  () {
            $(this).remove();
         });
     });
</script>

案例：表格操作

 学习JQuery有很多在线手册

（7）前端整合

应用HTML、CSS、Javascript、jQuery、Bootstrap（动态效果依赖jQuery）

引用的时候注意，一定是先应用