前端小测DOM基础测试34(节点遍历)

DOM 基础

所有小题共用一个上下文:

  1. 获取页面上所有的<a>元素

  2. 获取页面上面所有的链接元素

  3. 遍历上面所有的链接元素,如果:

    • 当链接元素中 href 属性值以’javascrpt:’开头的元素,则设置 role 属性为’button’
    • 当前链接元素 herf 属性值对应的 url 地址和当前网页地址栏中的 host 地址不一样,设置当前链接元素的 target 属性值为’_blank’,同事设置 rel 属性值包含’external’,’nofollow’,’noopener’
    • 当前链接元素 href 属性以’#’开头,则设置该元素 rel 属性值为’internal’

Read More

前端小测DOM基础(表单)

DOM 基础

已知有如下 HTML 代码:

1
2
3
4
5
<form id="loginForm" action="/account/login" method="post">
  <p>账号:<input name="username" required /></p>
  <p>密码:<input type="password" name="username" required /></p>
  <p>账号:<input type="submit" value="登录" /></p>
</form>

  • 获取<form>元素

  • <form>表单元素提交的时候组织默认的表单提交行为

  • <form>表单提交改成Ajax提交,这里不需要写 Ajax 请求代码,只需写下如何获取<form>表单元素下所有需要提交的数据

  • Ajax提交的时候需要阻止二次点击提交,请通过改变上面某个元素的某个属性实现防止二次提交

  • 页面上有个影藏的输入框可以显示用户来源,产品经理希望用户登录的时候,这个<form>表单元素外面的这个影藏输入框的数据也能一起提交上去(HTML 示意如下)
    <input name="form" type="hidden">

Read More

前端小测第四期(css选择器)

前端小测-css小测第二期题目:

一个标题,标题文字可能很长,然后标题后面跟了一些标签,这些标签有长有短,有多有少.结果发现有时候一行不够放,需要对标题进行打点处理,请实现:

  • 标题后打点

  • 标题前打点

效果图

Read More