文章/答案/技术大牛

发布

社区首页 >问答首页 >Javascript将url显示为超链接

问Javascript将url显示为超链接
EN

Stack Overflow用户

提问于 2017-10-23 16:27:13

回答 1查看 373关注 0票数 0

因此，我有一个URL，如果它存在于javascript表中，就会显示它。

我希望这个URL是一个超链接，用户可以点击，但不能完全得到它。

我试过了，但没能把它做好，也没能让它起作用。任何帮助都将不胜感激。

它可能很简单，但我的头现在被烧焦了。

<script type="text/javascript">
    //var memos;

    if (window.XMLHttpRequest) { // IE7+, Firefox, Chrome, Opera, Safari
        var xmlhttp = new XMLHttpRequest();
    } else { // IE6, IE5
        var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.open("GET", "memos.xml", false);
    xmlhttp.send();
    xmlDoc = xmlhttp.responseXML;
    memos = xmlDoc.getElementsByTagName("memo");  

    // Function to get values from xml and print in a table
    function showTable() {
        // For loop to iterate through each memo in XML. 
        for (var count = 0; count < memos.length; count++) {
            // Get attribute 'id' from xml and assign to id variable.
            id = memos[count].getAttribute("id");
            // Get element title from XML and get its value and assign to 'title' variable.
            title = memos[count].getElementsByTagName("title")[0].childNodes[0].nodeValue;
            sender = memos[count].getElementsByTagName("sender")[0].childNodes[0].nodeValue;
            recipient = memos[count].getElementsByTagName("recipient")[0].childNodes[0].nodeValue;
            date = memos[count].getElementsByTagName("date")[0].childNodes[0].nodeValue;
            message = memos[count].getElementsByTagName("message")[0].childNodes[0].nodeValue;
            urlNode = memos[count].getElementsByTagName("url")[0];
            //Check if URL element is empty. If empty then populate with "" else print out the URL value
            if (urlNode.hasChildNodes()) {
                url = urlNode.childNodes[0].nodeValue;
            } else {
                url = "";
            }
            // Print out the table
            document.write("<tr><td>" + id + "</td> " +
                " <td>" + title + "</td> " +
                " <td class='center'>" + sender + "</td> " +
                " <td class='center'>" + recipient + "</td> " +
                " <td class='center'>" + date + "</td> " +
                " <td class='center'>" + message + "</td> " +
                " <td class='center'>" + url + "</td></tr>");
        }
    }
</script>
</head>

<body>
    <h1>List of Memos!</h1>
    <br>

    <script type="text/javaScript">
        document.write("
        <h2 align='center'>There are currently " + memos.length + " memos altogether</h2>"); document.write("
        <br>");
    </script>

    <table class="table2">
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>Sender</th>
            <th>Recipient(s)</th>
            <th>Date</th>
            <th>Message</th>
            <th>URL</th>
        </tr>

        <!-- Javascript to display the table -->
        <script type="text/javascript">
        <!-- Call the showTable function created in Javascript above -->
            showTable();
        </script>

    </table>

</body>

</html>

javascript

html

url

hyperlink

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-10-23 16:43:10

更改：

" <td class='center'>" + url + "</td></tr>");

至

" <td class='center'><a href='#" + url + "'>" + url  + "</a></td></tr>");

更新为处理空白urls

更改：

" <td class='center'>" + url + "</td></tr>");

至

" <td class='center'><a href='" + ((url == null || url == "")  ? "#" : url) + "'>" + url  + "</a></td></tr>");

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/46894162

复制

相似问题

问Javascript将url显示为超链接
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript将url显示为超链接EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Javascript将url显示为超链接
EN