个人小收获

html css js jquery总结

Html部分：

1. table标签中:-cellspacing:设置两个单元格之间的宽度;

              -cellspadding:设置文本内容和表格边框的宽度。

              -colspan:把多列合成一列；

              -rowspan:把多行合成一行。

   2.文本里面的标签：-<hr>产生一条横线的标签

                   -<ul>无序列表的标签

                   -<ol>有序列表的标签

   3.一些特殊的标签：-<u>下划线的标签

                   -<em>,<i>倾斜的标签

                   -<b>,<strong>加粗的标签

                   -<del>删除线的标签

 4.css中的选择器：-class：   .classname{}

                  -id:       #id{}

                  -标签     标签{}

                  -分类，分组，派生等等

5.表单里面的标签：-form标签：它内部嵌套用于用户输入数据的标签

                   -action:表单提交的请求地址（url）

                   -method：请求的方式get、post

                   -enctype：设置它的类型，对请求参数的处理方式

                   -input标签：用于用户输入数据

                   -name标签：人输入的数据，传输到服务器端的时候，java根据name的值，获取到输入框里的值。

                   -reset事件，清空表单中数据

                   -checked=“checked”视为默认选项。

                   -selected=“selected”设置默认选中项。

                   -select 下拉列表的标签其中multiple为多下拉列表。

                   -texttarea:多行文本框标签

                   -fieldset:多组标签。

6.css中的overflow： a.hidden:对溢出的解决方法：隐藏

                    b.scroll:设置出现滚动条

                    c.visible:溢出部分可看见

                    d.auto:继承父类元素的溢出部分。

7.border-radius:  这为边框圆角显示出现。

 float：left   浮动：左浮动

盒子模型中：margin:外边距  padding内边距

伪类；hover,其实是鼠标移入到某位置，该位置就发生变化。

8.css中的文本样式和表格样式：-font-size字体大小

                             -font-weight字体粗细

                             -text-decoration:underline:文字修饰-下划线

                             -line-height：行高

                             -border-collapse:collapse:边框合并

9.css中的display： -none

                   -block：设置为块级元素

                   -inline：设置为行内元素

10.  Css中的定位：-relative:相对定位

               -absolute:绝对定位

               -fixed：固定定位

 注：给元素设置了定位之后，如果被定位的元素的位置相同，则重合在一起，可以使用z-index修饰显示，数值越大显示越接近。

Js部分：

1. let/var span:定义变量（let或var是定义变量的关键字）

  <script>中只能写符合js的语法规则的语句。

2.document对象是js里面的内置对象。

   Onclick:js中的单击事件，则执行单击事件对应的函数。

   isNaN函数：用来判断一个数是否是函数，不是返回true，是返回false

  Let x=input.value:根据元素的属性来获取数据值。

  innerHTML:给标签元素的内部嵌套其他的文本内容。

3.js中的变量，在拿来条件判断的时候。非空为true，空为false。

  js中，boolean参与运算的时候，true为1，false为0。

  js中，string参与运算的时候，做的是字符串的拼接。

  

4.数据类型转换相关的函数：typeof（变量名）；tostring（）；parseInt()；parseFloat();null;underfined-（没有赋值的）。

5.js中的this：表示当前被触发单击事件的元素对象。

6.js创建数组：let xx=new Array();    xx.push(添加尾部元素)，xx.pop(取出尾部元素)，xx.unshift(添加头部元素)，xx.shift(取出头部元素) xx.sort()进行顺序排序，xx.reverse()进行逆序排序。

  数组中的函数：-jion函数：把函数按指定的字符串拼接为一个字符串。

                -concat函数：用于给数组连接新的元素。

                -slice函数：用于获取子数组，可指定范围，都是开区间。

7.设置一个定时器：-setInterval(,num)   (num单位为毫秒)

   关闭定时器：clearInterval();

  一次性的定时器：setTimeout(,num)   (num单位为毫秒)

8.正则表达式-正则练习网址： https://www.codejiaonang.com/
正则在线测试网站： RegExr: 学习、构建 和 测试 正则表达式 Test RegEx

9.Dom:document-object-model:文档对象模型：

节点的父节点：parentNode:

节点的子节点：childNodes:

---chrildren:找到子节点，只包含元素节点

---firstChild:第一个孩子，所有孩子中的第一个，可能是文本节点。

---firstChildElement:第一个孩子，代表孩子中的第一个元素节点

---lastChild:最后一个孩子,所有孩子中的最后一个，可能是文本节点

---lastChildElement:最后一个孩子，代表孩子中的最后一个元素节点。

节点的兄弟节点：previousSibling:上一个兄弟，previousElementSilbingnext

上个元素节点兄弟； -next...下一个兄弟

10,节点的操作：

 

11.js中的bom(浏览器对象模型)

<script>

    -Srceen.width; srceen.heigth;  screen.availWidth(屏幕实际宽度)

-history.back()返回浏览器之前=history.go(-1);

history.forward();浏览器窗口对象的一部分访问。

Location.reload():重新加载浏览器

      Location.href=“http://www.baidu.com”。浏览器当前的网页为。

   Let xx=window.open(“http://www.baidu.com”,”这是百度网站”)

  ：open方法有返回值，为返回打开新窗口的对象。

     Window.colse(xx); colse方法进行关闭。

</srcipt>

12.js中创建对象：let xx=new Object();

Js-event对象：-event.clientX

              -event.clientY

检查其事件源：event.target  event.srcElement

Event.cancelBubble=true;取消冒泡，只执行自己。

jQuery部分：

1. 需要引入<script src="../js/jQuery.js"></script>
2. Eq是jQuery提供的获取元素的一个方法。
3. jQuery的选择器：id： $("#d1");

标签：$("h2"); class： $(".impt");

4.$("#ipt1").val("hello");//更改输入框里的东西

    $("#d3").attr("id","d3");//更改ID

    visiable：可见的      hidden：隐藏的

$("p:visiable").hide();

$("p:hidden").show();

5.jQuery相关的函数可查阅的网站：

slideDown([s],[e],[fn]) | jQuery API 3.2 中文文档 | jQuery API 在线手册 (cuishifeng.cn)

6.jQuery中的dom操作：addClass()添加；toggleClass()切换；

removeClass()删掉

7.jQuery中两种遍历数组的方法：

 //一般遍历数组的方法

   let txtArr=new Array();

   for(let i=0;i<$chs.length;i++){

   txtArr.push($chs.eq(i).text())

   }

console.log(txtArr);

//jQuery的each函数(each遍历数组)

$chs.each(function(){

txtArr.push($(this).text())

$(this).click(function(){

$(this).css("color","green")

})

} )

8.jQuery提供了一个bind(绑定)函数，用于给对象绑定一个事件。

   unbind:解除绑定   阻止默认的submit事件

9.  jQuery中的append和append to：

a、append()

方法作用：向每个匹配的元素内部追加内容，在标签中插入内容。

前面是被插入的对象，后面是要在对象内插入的元素内容。

使用格式

 $(selector).append(content)

被追加的content参数，可以是字符、HTML元素标记，还可以是一个返回字符串内容的函数。

其方法是将方法里面的参数添加到jquery对象中来；

如：A.append(B)的意思是将B放到A中来，后面追加,A的子元素的最后一个位置；

b、appendTo()

方法作用：把所有匹配的元素追加到指定的元素元素集合中，将内容插入标签。

前面是要插入的元素内容，而后面是被插入的对象。

使用格式

$(content).appendTo(selector);

参数content表示需要插入的内容，参数selector表示被选的元素，即把content内容插入selector元素内，默认是在尾部。

其方法是将jquery对象添加到appendTo指定的参数中去。

如：A.appendTo(B)的意思是将A放到B中去，后面追加,B的子元素的最后一个位置；

9999