美文网首页
09-阐述内容、样式和行为分离

09-阐述内容、样式和行为分离

作者: 陈光展_Gz | 来源:发表于2019-04-15 20:45 被阅读0次

    这是面试时候可能遇到的一道题


    一、先说观点

    • 我认为内容、样式和行为分离,根据W3C标准来说,就是html负责内容,CSS负责样式,JS负责行为。

    二、提供论据

    • 类似这样的题目,如果正面不好回答的情况下,可以尝试反着回答,如人为什么要吃饭,答:如果人不吃饭就会饿死!

    1. 假设html控制样式,如图
      html控制样式
    • <center>标签把文字居中,然后用<strong>加粗文字。
    • 这样的写法把原本简单的逻辑结构变得复杂话,不利于代码的维护。
    • 如果html也负责样式的话,使得内容的结构有很多无用的标签,有的标签表示内容,有的标签表示样式,这样我就很难区分内容的逻辑结构
    1. 假设用CSS写内容
      CSS写内容
    • 这样写会导致用户选取不到文字
    • 而且JS取不到这里的文本内容
    • 假如用CSS控制行为,那么CSS里面有很复杂的逻辑,会导致CSS很慢,最终影响页面加载速度
    1. 假设用JS控制样式
    • 还没写$div.hiden()之前
    • 写了$div.hiden()之后,文字就被隐藏
    • 加上$div.show()文字又出现

      那么问题来了
    • $div.show()之后,div的属性为display: block;,那么有可能在$div.hiden()之前,原本的div标签属性是display: flex;,经过$div.show()改变了属性的值为block,那么页面的flex布局就会全局炸掉

    三、总结


    • 为了以后改版时更方便,直接修改样式,而不动HTML的内容。更方便易于阅读样式和内容,便于项目的维护。
    • 网页的内容直接暴露在搜索引擎面前,这样有利于搜索引擎抓取网页的内容。

    相关文章

      网友评论

          本文标题:09-阐述内容、样式和行为分离

          本文链接:https://www.haomeiwen.com/subject/cifpwqtx.html