论坛 › 甘肃 › 《网页制作从入门到精通》观后笔记

9q13nh 发表于 2024-7-27 21:03:02

《网页制作从入门到精通》观后笔记

    <h1 style="color: black; text-align: left; margin-bottom: 10px;">文字和段落标记</h1> &amp;npsp； <span style="color: black;">表率</span>一个半角空格。<h1 style="color: black; text-align: left; margin-bottom: 10px;">超链接的<span style="color: black;">目的</span>窗口target</h1><span style="color: black;">1. </span>-self 在当前页面中打开链接
    <span style="color: black;">2. </span>-blank 在一个全新的空白窗口中打开链接
    <span style="color: black;">3. </span>-top 在顶层框架中打开链接，<span style="color: black;">亦</span><span style="color: black;">能够</span>理解为在根框架中打开链接。
    <span style="color: black;">4. </span>--parent 在当前框架的上一层里打开链接<h1 style="color: black; text-align: left; margin-bottom: 10px;">下载文件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">html中怎么下载例如pdf这种资源文件，而不是点击浏览器的窗口打开它们？</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">处理</span><span style="color: black;">方法</span>：在标签元素中设置一个下载属性download<span style="color: black;">就可</span>。</p>&lt;a href=<span style="color: black;">"http://link/to/file"</span> download=<span style="color: black;">"文件名<span style="color: black;">叫作</span>”&gt;点击下载&lt;/a&gt;</span>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">常用border属性值</h1><span style="color: black;">dotted</span> <span style="color: black;">点线边框</span>
    <span style="color: black;">dashed</span> <span style="color: black;">虚线边框</span>
    <span style="color: black;">solid</span> <span style="color: black;">实线边框</span>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">onchange 事件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">它是一个与表单<span style="color: black;">关联</span>的事件，当利用text或textarea 元素输入的字符串改变时<span style="color: black;">出现</span>该事件，<span style="color: black;">同期</span>当在select 下拉框中的一个选项状态改变后<span style="color: black;">亦</span>会<span style="color: black;">诱发</span>该事件。</p><span style="color: black;">&lt;<span style="color: black;">body</span>&gt;</span>
    输入你的名字: <span style="color: black;">&lt;<span style="color: black;">input</span> <span style="color: black;">type</span>=<span style="color: black;">"text"</span> <span style="color: black;">id</span>=<span style="color: black;">"fname"</span> <span style="color: black;">onchange</span>=<span style="color: black;">"myFunction()"</span> /&gt;</span>
    <span style="color: black;">&lt;<span style="color: black;">p</span>&gt;</span>当你离开输入框后，函数将被触发，将小写字母转为大写字母。<span style="color: black;">&lt;/<span style="color: black;">p</span>&gt;</span>

    <span style="color: black;">&lt;<span style="color: black;">script</span>&gt;</span><span style="color: black;">
      <span style="color: black;"><span style="color: black;">function</span> <span style="color: black;">myFunction</span>() </span>{
      <span style="color: black;">var</span> x = <span style="color: black;">document</span>.getElementById(<span style="color: black;">"fname"</span>);
      x.value = x.value.toUpperCase();
      }</span><span style="color: black;">&lt;/<span style="color: black;">script</span>&gt;</span>
    <span style="color: black;">&lt;/<span style="color: black;">body</span>&gt;</span>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">onselect 事件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">是当文本框中的内容被选中时所<span style="color: black;">出现</span>的事件。</p><span style="color: black;">&lt;<span style="color: black;">body</span>&gt;</span>
    <span style="color: black;">有些</span>文本: <span style="color: black;">&lt;<span style="color: black;">input</span> <span style="color: black;">type</span>=<span style="color: black;">"text"</span> <span style="color: black;">value</span>=<span style="color: black;">"Hello world!"</span> <span style="color: black;">onselect</span>=<span style="color: black;">"myFunction()"</span>&gt;</span>
    <span style="color: black;">&lt;<span style="color: black;">script</span>&gt;</span><span style="color: black;">
      <span style="color: black;"><span style="color: black;">function</span> <span style="color: black;">myFunction</span>()</span>{
      alert(<span style="color: black;">"你选中了<span style="color: black;">有些</span>文本"</span>);
      }
    </span><span style="color: black;">&lt;/<span style="color: black;">script</span>&gt;</span>
    <span style="color: black;">&lt;/<span style="color: black;">body</span>&gt;</span>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">onError 事件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在加载文档的过程中，<span style="color: black;">出现</span>错误时<span style="color: black;">出现</span>的事件。</p>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">onLoad 事件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">当加载网页文档时，会产生该事件。onLoad事件的<span style="color: black;">功效</span>是当首次载入一个页面文件时检测cookie的值，并用一个变量为其赋值，使其<span style="color: black;">能够</span>被源代码<span style="color: black;">运用</span>。</p>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">onUnload 事件</h1>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">当退出网页时<span style="color: black;">诱发</span>onUnload事件，并可更新cookie的状态。</p>onload onunload onbeforeunload 三个事件的区别
    onload是在页面载入的时候触发，与之相反onunload是在页面关闭（卸载）的时候触发，至于onbeforeunload<span style="color: black;">指的是</span>页面将要关闭的时候触发（<span style="color: black;">通常</span>用于弹出<span style="color: black;">是不是</span>确认关闭的时候）<span style="color: black;">1</span>） 打开页面时：onload
    <span style="color: black;">2</span>） 刷新页面时：onbeforeunload--&gt;onunload
    <span style="color: black;">3</span>） 关闭网页时：onbeforeunload--&gt;onunload--&gt;onload
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">浏览器内部对象</h1><span style="color: black;">1. </span>浏览器对象（navigator）：<span style="color: black;">供给</span><span style="color: black;">相关</span>浏览器的信息。
    <span style="color: black;">2. </span>文档对象（document）：document对象<span style="color: black;">包括</span>了与文档元素<span style="color: black;">一块</span>工作的对象。
    <span style="color: black;">3. </span>窗口对象（windows）：Windows对象<span style="color: black;">处在</span>对象层次的最顶端，它<span style="color: black;">供给</span>了处理浏览器窗口的<span style="color: black;">办法</span>和属性。
    <span style="color: black;">windows对象常用的<span style="color: black;">办法</span>：Open(); Close（）；Home（）</span>
    <span style="color: black;">4. </span>位置对象（location）：location对象<span style="color: black;">供给</span>了与当前打开的URL<span style="color: black;">一块</span>工作的<span style="color: black;">办法</span>和属性，它是一个静态的对象。
    <span style="color: black;">5. </span>历史对象（history）：history 对象<span style="color: black;">供给</span>了与历史<span style="color: black;">名单</span><span style="color: black;">相关</span>的信息。
    <h1 style="color: black; text-align: left; margin-bottom: 10px;">网页制作小知识技巧</h1>刷新网页
    &lt;meta http-equiv=<span style="color: black;">"refresh"</span> content=<span style="color: black;">"10; url=http:/自己的url<span style="color: black;">或</span>要<span style="color: black;">转</span>的url<span style="color: black;">位置</span> "</span>&gt;

    清除页面中的框架结构
    --&gt; 在链接属性加入 target=<span style="color: black;">"_top"</span>
    &lt;a href=<span style="color: black;">"http://"</span> target=<span style="color: black;">"_top"</span>&gt;清除页面中的框架结构&lt;/a&gt;

    在网页中加入最后修改日期<span style="color: black;">document</span>.write(<span style="color: black;"> 最后修改日期</span> + <span style="color: black;">document</span>.lastModified);

    点击关闭窗口
    JavaScript:<span style="color: black;">window</span>.close();

情迷布拉格 发表于 2024-9-9 17:17:17

你的见解真是独到，让我受益匪浅。

j8typz 发表于 2024-10-2 00:56:38

感谢你的精彩评论，为我的思绪打开了新的窗口。

4zhvml8 发表于 2024-10-4 05:52:30

你的言辞如同繁星闪烁，点亮了我心中的夜空。

nykek5i 发表于 2024-10-13 21:40:01

回顾历史，我们不难发现：无数先辈用鲜血和生命铺就了中华民族复兴的康庄大道。

m5k1umn 发表于 2024-10-27 13:05:33

楼主继续加油啊！外链论坛加油！

b1gc8v 发表于 2024-11-14 05:09:58

感谢楼主的分享！我学到了很多。

查看完整版本: 《网页制作从入门到精通》观后笔记