2021.2.23 前端题

【HTML】html的元素有哪些(包含H5)?

<h1> 一号标题
<br> 换行
<a> 链接
<img> 图片
<li> 列表
<ul>无序列表
<ol>有序列表
<table> 表格
<form> 表单
<span> 行元素
<div> 把文档分为不同的节
<u> 斜体
<b> 加粗
<title>表头
<p>分段
<meta>元信息
<head>页面的头 不会显示
<body>会显示在页面中
<script>在html中插入jscript代码
<style>样式
<link>规定文档与引入文档的关系,定义样式表
只记得这些~
h5的也没学

参考答案:【html的元素有哪些(包含H5)?】

  1. 行内元素:
    a:超链接
    span:文本
    img:图片
    i
    strong:加粗,强调
    table、tbody、tr、th、td:表格
    input:输入
    form:表单
    button:按钮
  2. 块级元素:
    div:块级
    p:段落
    h1-h5:标题
    ul、ol、li、dl、dd、dt:列表
  3. h5新增标签:
    audio:音频
    video:视频
    header:头部
    section:内容块
    footer:底部
    aslide:侧边
    nav:导航
    address:地址

【CSS】CSS选择器有哪些?哪些属性可以继承?

参考答案
占位:

  1. 选择器
    1.1)
  • 通用选择器(*)
  • 类别选择器(.class)
  • ID选择器(#id)
  • 标签选择器(element)
  • 后代选择器(element element)
  • 子选择器(element>element)
  • 群组选择器(element,element)
  • 相邻同胞选择器(element+element)
  • 伪类选择器(:link :visited :active :hover :focus :first-child)
  • 伪元素选择器(:first-letter :first-line :before :after :lang(language))
  • 属性选择器([attribute] [attribute=value] [attribute~=value] [attribute|=value] )

1.2) CSS新增选择器

  • 层次选择器(p~ul)
  • 伪类选择器(:first-of-type :last-of-type :only-of-type :only-child :nth-child(n) :nth-last-of-type(n) :last-child :root :empty :target :enabled :disabled :checked :not(selector))
  • 属性选择器([attribute*=value] [attribute^=value] [attribute$=value])
  1. 继承
    css继承特性主要是指文本方面的继承。
    2.1)不可继承的:
    display、margin、border、padding、background、height、min-height、max-height、width、min-width、max-width、overflow、position、top、bottom、left、right、z-index、float、clear、 table-layout、vertical-align、page-break-after、page-bread-before和unicode-bidi。

2.2) 所有元素可继承的:
visibility和cursor

2.3) 终极块级元素可继承的:
text-indent和text-align

2.4) 内联元素可继承的:
letter-spacing、word-spacing、white-space、line-height、color、font、font-family、font-size、font-style、font-variant、font-weight、text-decoration、text-transform、direction

2.5) 列表元素可继承的:
list-style、list-style-type、list-style-position、list-style-image

【JS】写一个方法去掉字符串中的空格。

function replacekg(str){
    //trim()去掉两头的空格
    return str.trim().replace(/\s*/g,'')
}

参考答案

  1. var trim = function(str){
    return str.replace(/\s*/g,"");
    }
  2. str.replace(/\s*/g,""); // 去除字符串内所有的空格
  3. str.replace(/^\s*|\s*$/g,""); // 去除字符串内两头的空格
  4. str.replace(/^\s*/,""); // 去除字符串内左侧的空格
  5. str.replace(/(\s*$)/g,""); // 去除字符串内右侧的空格

关于正则匹配
^表示字符串必须以后面的规则开头, 在这里就是说字符串必须以\s开头.
\s 是空格的意思, * 表示有0个或多个
\s
就是有0个或多个空格
(^\s*) 表示的就是以0个空格或者多个空格开头
| 表示或的意思, 也就是满足| 左边的也成立, 满足 | 右面的也成立.
\s前面说过了
$ 的意思是字符串必须以前面的规则结尾
(\s
$)(注意这里因为要把$转义才加的)的意思就是, 以0个空格或者多个空格结尾
/…/g 是正则表达式的属性, 表示全文匹配, 而不是找到一个就停止.
所以这个正则表达式替换的就是前导空格和后导空格
因为有前导空格, 就说明以0个或多个空格开头, 满足正则表达式中 | 前面的条件: (^\s*)
而如果有后导空格, 就说明以0个或多个空格结尾, 满足正则表达式中 | 后面的条件: (\s*$)

【Vue】v-model的原理。

v-model是将页面上控件的输入与相关属性值进行双向绑定的指令。
v-model是靠v-bind绑定响应式数据和触发input事件来实现双向传值。
v-bind用于数据和元素属性的动态绑定(给元素属性动态赋值)。元素(比如某个< a> 标签)的属性(比如href属性)本身是具有初始值的,与其绑定的数据的改变会引起元素属性改变。

<input v-model="sth" />
//  等同于
<input :value="sth" @input="sth = $event.target.value" /> 

data(sth)值传给元素属性 :value ==》sth->value

元素属性传给data @input=“sth = $event.target.value” ==》value->sth

v-bind使用

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值