[英]Getting the title attribute using javascript
我對 Javascript 還很陌生,我正在做一個使用面部識別來檢測情緒的項目。 面部識別部分正在檢測情緒,但我需要訪問由此產生的情緒。 面部識別 API 不斷有反饋,結果在“div” id= results 標簽下不斷變化
<div id="results" style="word-wrap:break-word;">
<span> Timestamp: 93.12 </span>
<br>
<span>Number of faces found: 1</span>
<br>
<span> Appearance: {"gender":"Male","glasses":"Yes","age":"25 - 34","ethnicity":"Black African"}</span><br><span>Emotions: {"joy":0,"sadness":0,"disgust":1,"contempt":0,"anger":0,"fear":0,"surprise":0,"valence":0,"engagement":0}
</span>
<br>
<span> Emoji:
<img class="chromoji" title="Neutral Face" alt=":neutral_face:" src="chrome-extension://cahedbegdkagmcjfolhdlechbkeaieki/images/apple/1f610.png"></span>
<br>
</div>
標題“Neutral Face”或 alt 是所需的占主導地位的 emption 的屬性之一
我嘗試使用解決方案
使用 Javascript 提取 HTML 中標簽的屬性以及如何使用 javascript 從類中的鏈接中獲取標題屬性
在我的實際代碼中,我有
<div id="results" style="word-wrap:break-word;">
<script>
//var images = document.querySelectorAll('img');
var emotion = document.getElementByTagName("img")[0].getAttributes("title");
console.log(emotion)
</script>
</div>
我嘗試在生成結果的 JS 文件中使用此代碼段中的最后兩行代碼
detector.addEventListener("onImageResultsSuccess", function(faces, image, timestamp) {
$('#results').html("");
log('#results', "Timestamp: " + timestamp.toFixed(2));
log('#results', "Number of faces found: " + faces.length);
if (faces.length > 0) {
log('#results', "Appearance: " + JSON.stringify(faces[0].appearance));
log('#results', "Emotions: " + JSON.stringify(faces[0].emotions, function(key, val) {
return val.toFixed ? Number(val.toFixed(0)) : val;
}));
log('#results', "Emoji: " + faces[0].emojis.dominantEmoji);
drawFeaturePoints(image, faces[0].featurePoints);
var motion = faces[0].emojis.dominantEmoji;
log('#results', motion);
}
});
同樣在單獨的時間我將其添加到需要情感識別反饋的 JS 文件中
var tag = document.getElementByTagName("img")
var emotion= tag.getAttribute("title");
console.log(emotion);
同樣在另一個單獨的試驗中,我在索引 html 文件中做了這個
<script type="text/javascript">
var image = document.getElementsByTagName("img")[0];
var title = image.getAttribute("title");
console.log(title); // shows the value of title for the element "image"
</script>
該項目的主要思想是檢測用戶的情緒並根據該情緒播放音樂
你可以試試這個:
<script type="text/javascript">
var image = document.getElementsByTagName("img")[0];
var title = image.getAttribute("title");
console.log(title); // shows the value of title for the element "image"
</script>
在此處查看演示: http : //codepen.io/anon/pen/vyVQBJ
在您的評論之一中,您說您嘗試過
var emotion = document.getElementByTagName("img")[0].getAttributes("title");
嘗試改為使用
var emotion = document.getElementsByTagName("img")[0].getAttribute("title");
函數 getAttribute() 在末尾沒有 s,而函數 getElementsByTagName 在元素之后有一個 s。 此外,在您的腳本標簽中,將其聲明為 javascript 之類的,
<script type="text/javascript"> // your code </script>
別忘了在 console.log(emotion); 后面加一個分號。
不使用getAttributes("title")
使用getAttribute("title")
因為 JavaScript 中沒有像getAttributes
這樣的函數。
工作演示:
var emotion = document.getElementsByTagName("img")[0].getAttribute("title"); console.log(emotion);
<img class="chromoji" title="Neutral Face" alt=":neutral_face:" src="https://i.stack.imgur.com/cp7qK.png" width="400" height="200">
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.