欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

复习和js知识学习

程序员文章站 2022-04-18 13:50:01
...
  • HTML表单知识复习
表单标签:
lable(可以绑定一个表单元素,当点击lable标签内的文本时,浏览器会自动将光标转到或者对应的表单元素上,用来增加用户体验
   <label for="性别">性别</label><input type="text" id="性别">
    <input type="radio" id="男"><label for="男">男</label>

下拉表单元素:
select
    籍贯
    <select>
        <option>山东</option>
        <option selected="selected">四川</option>
    </select>

文本域表单元素:
textarea(cols显示每行显示多少个字符,rows显示几行)
    <form>
        今日反馈:
        <textarea cols="50" rows="5">
            我知道这个是用textarea写的
        </textarea>
    </form>

css规则由两个部门构成:选择器以及一条或多条声明。
选择器是用于指定css样式的HTML标签,花括号内是该对象设置的具体样式
选择器 :基础选择器和复合选择器
基础选择题:标签选择器、类选择器、id选择器和通配符选择器
标签选择器:选择页面中同类型标签统一设置,不能差异化设置。
类选择器:可以单独选择一个或几个标签。
.red {
color:red;
}
在标签里


  • id选择器:
    font-weight字体粗细(后面不要跟单位,700=bold ,400=normal)更方便用数字
    字体样式font-style(正常是normal,斜体是italic)
    选择器知识复习
  •         /* 通配符选择器*把所有的标签全部修改样式 不需要调用 自动给所有元素使用样式*/
            *{
                color: purple;
            }
            /* id选择器:样式#定义,结构id调用,只能调用一次,别人切勿使用 */
            #pink{
                color: pink;
            }
            /* 类选择器 */
            .red{
                width: 100px;
                height: 100px;
                /* 背景颜色 */
                background-color: red;
            }
            .green{
                width: 100px;
                height: 100px;
                background-color: green;
            }
    
    • css的引入方式
      行内样式表(书写方便,适合单独行修改)
      内部样式表(把样式写在style标签里,结构和样式部分分离)
      外部样式表(完全结构和样式分离,需要引入)

    • 快速生成HTML结构语法
      1.生成标签直接输入标签名按tab键即可比如div然后tab键,就可以生成


      2.如果想要生成多个相同标签加上就可以了比如div3就可以快速生成3个div
      3.如果有父子级关系的标签,可以用>比如ul > li就可以了
      4.如果有兄弟关系的标签,用+就可以了比如div+p
      5.如果生成带有类名或者id名字的,直接写.demo或者#two tab键就可以了
      6.如果生成的div类名是有顺序的,可以用自增符号$

    • 快速生成CSS样式语法
      CSS基本采取简写形式即可.
      1.比如w200按tab 可以生成 width: 200px;
      2.比如lh26按tab 可以生成line-height: 26px;
      格式化代码
      右键+格式化代码

    • 后代选择器
      元素1 元素2{样式声明}(只要元素2是元素1的后代都可以)
      一层一层找 元素1 元素2 元素3
      符号是空格

    • 子选择器
      {
      元素1>元素2(样式声明)
      只选择离它最近的一个元素
      符号是大于号

    • 并集选择器
      选择某些相同样式的元素(可以用于集体声明)
      符号是逗号

    • 伪类选择器
      :hover(鼠标经过的时候选择出来)
      :active(选择活动链接,鼠标按下未弹起的链接)
      :first-child()
      为确保伪类选择器生效保证link,visvited,hover,active的顺序
      focus伪类选择器
      把获得选中的表单更改

    html元素一般分为块元素和行内元素两种
    块级元素的特点︰
    1.比较霸道,自己独占一行。
    2.高度,宽度、外边距以及内边距都可以控制。
    3.宽度默认是容器(父级宽度)的100%。
    4.是一个容器及盒子,里面可以放行内或者块级元素。
    文字类元素里不能套块元素
    例如:p标签里不能放div
    行内元素的特点:
    1.相邻行内元素在一行上,一行可以显示多个。
    2.高、宽直接设置是无效的。
    3.默认宽度就是它本身内容的宽度。
    4.行内元素只能容纳文本或其他行内元素。
    行内块元素的特点:
    1.和相邻行内元素(行内块)在一行上,但是他们之间会有空白缝隙一行可以显示多个
    (行内元素特点)。
    2.默认宽度就是它本身内容的宽度(行内元素特点)。
    3.高度,行高、外边距以及内边距都可以控制(块级元素特点)。

    • js知识学习

    • 行内式js
      可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性),如:onclick
      注意单双引号的使用:在HTML中我们推荐使用双引号,JS中我们推荐使用单引号
      可读性差,在html中编写JS大量代码时,不方便阅读;
      ·引号易错,引号多层嵌套匹配时,非常容易弄混;
      特殊情况下使用

    • 内嵌JS

    <script>
    alert ( 'Hello world~! ' );</script>
    

    可以将多行JS代码写到<script>标签中内嵌JS是学习时常用的方式

    • 3.外部JS文件
    <script src="my.js"><l script>
    

    利于HTML页面代码结构化,把大段JS代码独立到HTML页面之外,既美观,也方便文件级别的复用引用外部JS文件的script标签中间不可以写代码
    ●适合于JS代码量比较大的情况

    • 多行注释 shift+alt+a

    方法:alert(msg)
    说明:浏览器弹出警示框

    方法:console.log(msg)
    说明:浏览器控制台打印输出信息

    方法:prompt(info)
    说明:浏览器弹出输入框,用户可以输入

    复习和js知识学习

    在程序里面,数字前面加0表示八进制
    数学前面加0x表示十六进制

    alert ( Infinity); ll Infinity
    alert (-Infinity) ; l l -Infinity
    alert (NaN);l//NaN
    lnfinity ,代表无穷大,大于任何数值
    -Infinity ,代表无穷小,小于任何数值
    NaN,Not a number,代表一个非数值

    isNaN(x) ×是一个非数字类型
    ×是数字,返回false
    x不是数字,返回true