it-roy-ru.com

Вставьте изображение в ячейку таблицы в Javascript

Я хочу вставить изображения в только что созданную ячейку. Как мне это сделать? Кто-нибудь может мне помочь? ... Вот мой код для вставки ячеек:

<!DOCTYPE html>
<html>
<head>
<script>
function displayResult()
{
var firstRow=document.getElementById("myTable").rows[0];
var x=firstRow.insertCell(-1);
x.innerHTML="New cell"
}
</script>
</head>
<body>

<table id="myTable" border="1">
  <tr>
    <td>First cell</td>
    <td>Second cell</td>
    <td>Third cell</td>
  </tr>
</table>
<br>
<button type="button" onclick="displayResult()">Insert cell</button>

</body>
</html>

Все, что я хочу, это вставить изображение в созданную ячейку.

7
user2462483

Вы можете создать элемент изображения и добавить его в новую ячейку:

function displayResult()
{
    var firstRow=document.getElementById("myTable").rows[0];
    var x=firstRow.insertCell(-1);
    x.innerHTML="New cell";

    var img = document.createElement('img');
    img.src = "link to image here";
    x.appendChild(img);
}

Остерегайтесь создания необработанного HTML-кода для изображения, если вы делаете это таким образом, вам необходимо убедиться, что вы избегаете src и любых других атрибутов.

18
MrCode

Просто установите внутренний HTML-код новой ячейки на HTML-элемент img с любым src или атрибутами, которые вы пожелаете. 

function displayResult()
{
    var firstRow=document.getElementById("myTable").rows[0];
    var x=firstRow.insertCell(-1);
    x.innerHTML="<img src='myImageURL' alt='hello'/>";
}
6
p e p
 function displayResult()
    {
   document.getElementById("myTable").rows[0].innerHTML="your image";
    }

может быть, это может помочь, динамизм может быть достигнут позже, просто попробуйте, работает ли он сейчас?

0
user2412575