使用javascript设置HTML img标题属性

Set an HTML img title attribute using javascript

本文关键字：标题 属性 img HTML javascript 设置 使用      更新时间：2023-09-26

更新:标题拉正确，但在Internet Explorer中图像的标题不显示。适用于Firefox和Chrome。我无法理解它，我在说这个:

<script type="text/javascript" src="//www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<html>
    <i><strong><a href="__URL__" target="_blank">PDW Status: </a></strong></i>
    <a href="__URL__" target="_blank"></a>
    <a href="__URL__" target="_blank"><br/></a>
    <a href="__URL__" target="_blank">Green</a>&#160;-
    <img id="Green" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="lightgreen1.jpg"
    src="__URL__" style="margin: 5px;"/></em>&#160;&#160;&#160;&#160;&#160;
    <a href="__URL__" target="_blank">Red</a>&#160;-  
    <img id="Red" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="red1.jpg"
    src="__URL__" style="margin: 5px;"/></em>&#160;&#160;&#160;&#160;&#160;
    <a href="__URL__" target="_blank">Yellow</a>&#160;- 
    <img id="Yellow" class="ms-rtePosition-4 ms-rteImage-2 ms-rteStyle-Emphasis" alt="yellow1.jpg"
    src="__URL__" style="margin: 5px;"/>&#160;&#160;&#160;&#160;&#160;
    <a href="__URL__" target="_blank">White</a> &#160;-
    <img id="White" class="ms-rteImage-2 ms-rtePosition-4" alt="white.jpg"
    src="__URL__" style="margin: 5px;"/>&#160;
</html>

<style>
    a:link { text-decoration: none;
    color: #0072c6 } a:visited { text-decoration: none; color: #0072c6 } a:hover { text-decoration: underline;  } a:active { text-decoration: underline; }
</style>​
<script type="text/javascript">
//Grab data from list and post into HTML Fields
$(function() {
    green = "";
    yellow = "";
    red = "";
    white = "";
    $.ajax({
            url: "__URL__",
            headers: {"Accept": "application/json;odata=verbose"}, 
            type: "GET", 
            cache: false,
            async: false,      
        }).success(function (data) {
            $.each(data.d.results, function(key, value) {
                 console.log(value.Title);
                 switch (value.Title) {
                    case "GREEN":
                        green += value.Description;
                        console.log("GREEN TEST" + green);
                        var gDescription = document.querySelector('#Green');
                        gDescription.title = "" + green;    
                        break;
                    case "YELLOW":
                        yellow += value.Description;
                        console.log("YELLOW TEST" + yellow);
                        var yDescription = document.querySelector('#Yellow');
                        yDescription.title = "" + yellow;   
                        break;
                    case "RED":
                        red += value.Description;
                        console.log("RED TEST" + red);
                        var rDescription = document.querySelector('#Red');
                        rDescription.title = "" + red;
                        break;
                    default:
                        white += value.Description;
                        console.log("WHITE TEST" + white);
                        var wDescription = document.querySelector('#White');
                        wDescription.title = "" + white;
                }
        });
    });
});
</script>

这是一个相关的问题，但似乎没有解决它:为什么我可以't设置一个ascii引用在一个img标题属性使用js?

你试过了吗:

var image = document.querySelector('img');
image.title = 'Your title'; // Assigning directly to attribute.
image.setAttribute('title', 'Your other title'); // Assigning by method.

这是如何使用javascript设置HTML图像标题属性

相关文章：