zoukankan      html  css  js  c++  java
  • 局部(或全局)设置<a>标签的target属性

            对于超链接<a>标签,target属性的设置是比较关键的,在不同的用户场景下选用适合的新页面载入方式,可以大大的提高访客的体验感。我们一般对target的设置可以挨个来,但如果我们需要在局部或者全局对所有的<a>标签target属性进行设置,那要怎么做呢?   
     
    ╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱分割线在此╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲╲
     

    ★  对整个页面内所有<a>统一设置设置

            如果我们需要对整个页面内所有<a>标签的target属性都为‘_blank’,即点击超链接之后以弹出新页面的方式打开;那么我们只需要在<head></head>里面加入如下这句代码,就能够实现。       
    <basetarget="_blank">
    

             需要注意的是,如果我们需要对某个特定的超链接以不同的方式打开,那么可以在该<a>标签内直接设置不同的target属性值就可以了。(因为内联设置的优先级高于外部的)

    ★  

             由于网页的布局一般是分成几个不同的内容块,在不同的内容块超链接<a>打开新页面的方式也有些不同。因此这就涉及到对局部内<a>标签的设置。
           ◇ 实现方法   自定义JS函数 
    示例代码
    <ahref="http://www.baidu.com">百度去</a>
    <ahref="http://www.sogou.com">搜狗去</a>
    <ahref="http://www.sina.com">新浪去</a>
    <fieldsetid="portionA">
    <legend>局部<a></legend>
    <p>该容器内所有的target的属性值为"_self"</p>
    <ahref="http://www.baidu.com">百度去</a>
    <ahref="http://www.sogou.com">搜狗去</a>
    <ahref="http://www.sina.com">新浪去</a>
    </fieldset>
    <script>
    function portionA(){
    var aN = document.getElementById("portionA").getElementsByTagName("a");
    for(var i =0; i < aN.length; i++){
    aN[i].target ="_self";/*遍历局部a标签并设置target属性值*/
    }
    }
    portionA();//调用函数
    </script>
    

     

      实现方法   利用jQuery
    提示   使用jQuery可获取当前容器下(无论有多少层容器嵌套)所有的a标签。
    实现代码
    <fieldsetid="portionA">
    <legend>局部<a></legend>
    <p>该容器内所有的target的属性值为"_self"</p>
    <ahref="http://www.baidu.com">百度去</a>
    <ahref="http://www.sogou.com">搜狗去</a>
    <ahref="http://www.sina.com">新浪去</a>
    </fieldset>
    <scriptsrc="JS/jquery-3.1.1.min.js"></script>
    <!--要引入jQuery先-->
    <script>
    $(document).ready(function(){
    $("#portionA").find("a").attr("target","_self");
    /*使用find方法找到<a>标签,然后使用attr方法设置属性*/
    })
    </script>
    

      


    提示 默认情况下,点击超链接是在当前页面打开新网页,即" target='_self ' " ;
  • 相关阅读:
    现代软件工程 第一章 概论 第3题——韩婧
    现代软件工程 第一章 概论 第2题——韩婧
    小组成员邓琨、白文俊、张星星、韩婧
    UVa 10892 LCM的个数 (GCD和LCM 质因数分解)
    UVa 10780 幂和阶乘 求n!中某个因子的个数
    UVa 11859 除法游戏(Nim游戏,质因子)
    Codeforces 703C Chris and Road 二分、思考
    Codeforces 703D Mishka and Interesting sum 树状数组
    hdu 5795 A Simple Nim SG函数(多校)
    hdu 5793 A Boring Question 推公式(多校)
  • 原文地址:https://www.cnblogs.com/Jener/p/6052267.html
Copyright © 2011-2022 走看看