Alex's questions

对第一个向量进行排序后，如何正确组织 四个逻辑上相互连接的向量之间的数据同步？ 例如，我最初有：

let mut v01: Vec<&str> = vec!["111", "abc", "ghi", "222"];
let mut v02: Vec<&str> = vec!["One", "A", "G", "Two"];
let mut v03: Vec<&str> = vec!["i32", "&str", "&str", "i64"];
let mut v04: Vec<&str> = vec!["true", "false", "false", "true"];

之后let _ = v01.sort();
           ...
我想要得到这个结果：

["111", "abc", "ghi", "222"]
...
результат:

["111", "222", "abc", "ghi"]
["One", "Two", "A", "G"]
["i32", "i64", "&str", "&str"]
["true", "true", "false", "false"]

有两种情况很有趣：
（1）当向量 v01 没有重复元素时；
（2）当 v01 具有重复元素时，例如，v04对于此类（重复）元素具有不同的值。

如何修复代码行：if v.iter().any(|i| *i == s) {
匹配时获取向量索引，例如： Yes -> 1。

fn main() {

 let v: Vec<&str> = vec!["abc", "des", "xyz", "qwe"];   
    
 for (ind, val) in v.iter().enumerate() {
    
    println!("{} - {}", ind, val);
 }

 let s: &str = "des";    

 if v.iter().any(|i| *i == s) {
    println!("Yes");
    // println!("Yes -> {:?}", index_of_v); // Yes -> 1
    } else {
    println!("No");
 }    
}

如何修正代码以避免错误：
'a', 'b' -- is borrowed here
returns a value referencing data owned by the current function？

use std::collections::HashMap;

#[derive(Debug)]
struct Error;

fn f1(s: &str) -> Result<&str, Error> { 
   // something for test:
   if s.len() > 5 {
      Ok(s)
   }else{
      Err(Error)
   }      
}

fn f2(s: &str) -> Result<&str, Error> { 
   todo!() 
}



fn r(raw: HashMap<String, String>) -> Result<HashMap<&'static str, &'static str>, Error> {
    raw
        .into_iter()
        .map(|(a, b)| {
            
            // println!("{:?} - {:?}", a, b);
            Ok((
                f1(&a)?,
                f2(&b)?,
            ))
        })
        .collect()
}



fn main() {
    let raw: HashMap<String, String> = HashMap::from([
       ("Mercury".to_string(), "0.4".to_string()),
       ("Venus".to_string(), "0.7".to_string()),
       ("Earth".to_string(), "1.0".to_string()),
       ("Mars".to_string(), "1.5".to_string()),
    ]);
    
    println!("{:?}", r(raw));
}

下面两行在[A]应用程序代码[B]中给出相同的结果，即
可以互换并且应用程序可以正常运行。
我理解的是否正确：
第一个将签名转移到变量，即第二个函数本身foo
- 将函数工作的结果传递给变量foo

1. 如何从文档中输出 JoinHandle 的内容和主题行：
   fn from(join_handle: crate::thread::JoinHandle<T>) -> OwnedHandle {}

use std::thread;

fn foo() -> usize {
   88
}
    
fn main() {
    
   let h1: thread::JoinHandle<_> = thread::spawn(foo);             // [A]
   let h2: thread::JoinHandle<_> = thread::spawn(move || foo());   // [B]

   println!("h1 = {:?}", h1);
   println!("h2 = {:?}", h2);
}

播放

h1 = JoinHandle { .. }
h2 = JoinHandle { .. }

2. 那么如何在下面的例子中做类似的事情，以便它能够工作g2而不是g2()：
   play_2

fn foo() -> usize {
   88
}

fn f<T>(z: T) -> T {
   z
}

fn main() {
    
   let g1 = f(foo());
   println!("g1 = {:?}", g1);
    
   let g2 = f(foo);
   // println!("g2 = {:?}", g2); <- ?
   assert_eq!(g1, g2());

   // или 

   let v1 = foo;
   let v2 = foo();
   // println!("v1 = {:?}", v1);
   println!("v1 = {:?}", v1());
   println!("v2 = {:?}\n", v2);
}

第一个块中给出的代码有效。
如何将其放入impl创建单独线程的单独部分中？
就像第二个代码块一样，其中注意到так не работает.
播放_1

use std::time::{SystemTime, Instant};
use std::thread;
use thread::JoinHandle;


fn main() {

   let handle: JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> = thread::spawn(|| {
      let t21: SystemTime = SystemTime::now();
      let start_02 = Instant::now();
      let mut j: usize = 0;
      loop {
         if j == 10 { break; }
         j = j + 1;
      }
      let t22: SystemTime = SystemTime::now();
      let d2:(usize, SystemTime, SystemTime, core::time::Duration) = (j, t21, t22, start_02.elapsed());
      d2
   });

   
   let t11: SystemTime = SystemTime::now();
   let start_01 = Instant::now();
   let mut i: usize = 0;
   loop {
      if i == 10 { break; }
      i = i + 1;
   }
   let t12 = SystemTime::now();

   
   let d2 = handle.join().expect("thread panicked :...");

   println!("i = {:?} \nt11 = {:?} \nt12 = {:?}", i, t11, t12);
   println!("dt_01 = {:?}\n", start_01.elapsed());
   //
   println!("j = {:?} \nt21 = {:?} \nt22 = {:?}", &d2.0, &d2.1, &d2.2);
   println!("dt_02 = {:?}\n", &d2.3);
}

像这样的东西：
play_2

use std::time::{SystemTime, Instant};
use std::thread;
use thread::JoinHandle;

struct Thd {
   a: usize, 
   b: SystemTime, 
   c: SystemTime,
   d: core::time::Duration,
}

impl Thd {

   pub fn new() -> JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> {

     thread::spawn(|| {
       let t21: SystemTime = SystemTime::now();
       let start_02 = Instant::now();
       let mut j: usize = 0;
       loop {
         if j == 1_000_000 { break; }
         j = j + 1;
       }
       let t22: SystemTime = SystemTime::now();
       
       let d: Thd = Thd01 {a: j, b: t21, c: t22, d:start_02.elapsed()};
       
       let d2:(usize, SystemTime, SystemTime, core::time::Duration) = (d.a, d.b, d.c, d.d);

       d2
     });
   }
}

fn main() {
   // Error `так не работает`:
   let handle: JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> = Thd::new();

   
   let t11: SystemTime = SystemTime::now();
   let start_01 = Instant::now();
   let mut i: usize = 0;
   loop {
      if i == 1_000_000 { break; }
      i = i + 1;
   }
   let t12 = SystemTime::now();

   
   let d2 = handle.join().expect("thread panicked :...");

   println!("i = {:?} \nt11 = {:?} \nt12 = {:?}", i, t11, t12);
   println!("dt_01 = {:?}\n", start_01.elapsed());
   //
   println!("j = {:?} \nt21 = {:?} \nt22 = {:?}", &d2.0, &d2.1, &d2.2);
   println!("dt_02 = {:?}\n", &d2.3);
}

播放_3

use std::time::{SystemTime, Instant};
use std::thread;
use thread::JoinHandle;

struct Thd {
   a: usize, 
   b: SystemTime, 
   c: SystemTime,
   dt: core::time::Duration,
}

impl Thd {

   pub fn new() -> JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> {
   
     let handle: JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> =
     thread::spawn(|| {
       let t21: SystemTime = SystemTime::now();
       let start_02 = Instant::now();
       let mut j: usize = 0;
       loop {
         if j == 1_000_000 { break; }
         j = j + 1;
       }
     
       let t22: SystemTime = SystemTime::now();
       let d: Thd = Thd {a: j, b: t21, c: t22, dt:start_02.elapsed()};
       let d2:(usize, SystemTime, SystemTime, core::time::Duration) = (d.a, d.b, d.c, d.dt);
       d2
     });
     handle
   }
}

fn main() {
   // `так работает`:
   let handle: JoinHandle<(usize, SystemTime, SystemTime, core::time::Duration)> = Thd::new();

   
   let t11: SystemTime = SystemTime::now();
   let start_01 = Instant::now();
   let mut i: usize = 0;
   loop {
      if i == 1_000_000 { break; }
      i = i + 1;
   }
   let t12 = SystemTime::now();

   
   let d2 = handle.join().expect("thread panicked :...");

   println!("i = {:?} \nt11 = {:?} \nt12 = {:?}", i, t11, t12);
   println!("dt_01 = {:?}\n", start_01.elapsed());
   //
   println!("j = {:?} \nt21 = {:?} \nt22 = {:?}", &d2.0, &d2.1, &d2.2);
   println!("dt_02 = {:?}\n", &d2.3);
}

/*

i = 1000000 
t11 = SystemTime { tv_sec: 1737389697, tv_nsec: 383198522 } 
t12 = SystemTime { tv_sec: 1737389697, tv_nsec: 385890160 }
dt_01 = 2.931694ms

j = 1000000 
t21 = SystemTime { tv_sec: 1737389697, tv_nsec: 383252593 } 
t22 = SystemTime { tv_sec: 1737389697, tv_nsec: 386045474 }
dt_02 = 2.792891ms

*/

在编辑器中，vs code在包含代码的文件末尾，我有一组相继出现的注释，例如，如下所示：

/* По теме [A]
   ...
*/

/* По теме [B]
   ...
*/

/* По теме [C]
   ...
*/

就我而言，有十多个，我сворачиваю保存它们和文件。重新启动计算机并打开文件后，前四个注释始终会展开。如何发表评论：

• 1. 以它被保存和打开的形式
• 2. 打开时-所有评论都被折叠了？

还想了解：

是否有一个明智的解决方案来链接注释（记录代码：分配、所做的更改等），例如，将它们存储在数据库中并将它们输出到浏览器（本地主机），以便可以将文本和图像链接到代码并进行编辑。

如果我有一个 json 数据结构，其中abc键存储相同数据类型的元素数组，那么我可以像这样获取这些元素：

package main

import (
    "encoding/json"
    "fmt"
)

// var s = `{"abc":[["a"], [-0.0025], ["2022-09-20 15:20:06"], [null], [1663676406219]]}`
   var s = `{"abc":["a", "b", "c", "d", "e"]}`

func main() {
    var f map[string]interface{}

    if err := json.Unmarshal([]byte(s), &f); err != nil {
    panic(err)
    }

    d := []string{}
    for key := range f {
        d = append(d, key)
    }

    f1 := f[d[0]].([]interface{}) // т.е. f1 := f["abc"].(map[string]interface{})

    m := []string{}

    for h := range f1 {
        m = append(m, f1[h].(string))
    }

    fmt.Println("m = ", m)
    for i := 0; i < len(m); i++ {
        fmt.Println(m[i])
    }
}

  m =  [a b c d e]
  a
  b
  c
  d
  e

如果我有一个key数组，其中元素具有不同的数据类型，如上面的代码所示，那么就不可能显示这样的数据。这些不同数据类型的顺序不是恒定的。

对于此类数组包含相同类型的元素的情况，例如string，在循环内它的工作方式如下：

m = append(m, f1[h].([]interface{})[0].(string))
- - - - - - - - - - - - - - - - - - - - - - - -
f1 =  [[a] [b] [c] [d] [e]]
a
b
c
d
e

请告诉我如何获取这种情况的元素：

 1.  var s = `{"abc":[["a"], [-0.0025], ["2022-09-20 15:20:06"], [null], [1663676406219]]}`

如果我在数组中有多个元素并且它们也属于不同类型，如何正确执行此操作：

 2.  var s = `{"abc":[[33, "a"], [48, -0.0025], [55, "2022-09-20 15:20:06"], [77, null], [88, 1663676406219]]}`

将接收到的数据，其结构为json，输入到变量s中。

package main

import (
    "encoding/json"
    "fmt"
)

var s = `{
        "abc": {
               "a": {
                    "x": {"p": "val"},
                    "y": {"p": "msg", "b": 33.5, "ms": 0},
                    "z": {"p": "msg ", "b": -12, "ms": 0}
               },
               "b": ["x", "y", "z"],
               "c": [
                    [69, "text_05", "m n o"],
                    [4, " text_02", "def"],
                    [1, "text_01", "abc "],
                    [48, " text_04 ", "jkl"],
                    [5, " text_03 ", " ghi"],
                    [82, "text_06  ", " pq r "]
                    ]
               },
        "xyz": {
               "z": [
                    [11, "aaa"],
                    [33, "bbb"]
                    ]
}}`

func main() {
    var f map[string]interface{}

    if err := json.Unmarshal([]byte(s), &f); err != nil {

        fmt.Println(err)
    }

    d := []string{}
    for key := range f {
        d = append(d, key)
    }

    fmt.Println(len(d)) //  2
    fmt.Println(d)      //  [abc xyz]

    for j := 0; j < len(d); j++ {

        // ...
    }
}

如何获取给定结构的所有键和值。得到钥匙abc和xyz。如何遍历键：a、x、y、z、p、b、c及其值？

主表的 res 文本字段包含以下结构：

которую получаю запросом: SELECT res FROM main WHERE id = 5;

{
 "abc": {
        "a": {
             "x": {"p": "val"},
             "y": {"p": "msg", "b": 33, "ms": 0},
             "z": {"p": "msg ", "b": 12, "ms": 0}
        },
        "b": ["x", "y", "z"], 
        "c": [
             [69, "text_05", "m n o"],
             [4, " text_02", "def"],
             [1, "text_01", "abc "],
             [48, " text_04 ", "jkl"],
             [5, " text_03 ", " ghi"],
             [82, "text_06  ", " pq r "]
             ]
        },
 "xyz": {
        "z": [
             [11, "aaa"],
             [33, "bbb"]
             ] 
        }
 }

如何构建将返回数字 2 的查询， - 数量：“abc”和“xyz”。

在js中我这样做了：

 var s = {
 "abc": {
        "a": {
             "x": {"p": "val"},
             "y": {"p": "msg", "b": 33, "ms": 0},
             "z": {"p": "msg ", "b": 12, "ms": 0}
        },
        "b": ["x", "y", "z"], 
        "c": [
             [69, "text_05", "m n o"],
             [4, " text_02", "def"],
             [1, "text_01", "abc "],
             [48, " text_04 ", "jkl"],
             [5, " text_03 ", " ghi"],
             [82, "text_06  ", " pq r "]
             ]
        },
 "xyz": {
        "z": [
             [11, "aaa"],
             [33, "bbb"]
             ] 
        }
 };

  var c = Object.keys(s).length;

  alert(c); // 2

在 postgresql 上失败。

如果有这样的要求

SELECT res FROM main WHERE id = 3;

以这种 json 结构的形式返回数据（res - 文本字段），例如，

 {
 "abc": {
        "a": {
             "x": {"p": "val"},
             "y": {"p": "msg", "b": 33, "ms": 0},
             "z": {"p": "msg ", "b": 12, "ms": 0}
        },
        "b": ["x", "y", "z"], 
        "c": [
             [69, "text_05", "m n o"],
             [4, " text_02", "def"],
             [1, "text_01", "abc "],
             [48, " text_04 ", "jkl"],
             [5, " text_03 ", " ghi"],
             [82, "text_06  ", " pq r "]
             ]
 }
 }

然后通过什么查询，您可以获得并仅对以下内容进行排序：

        [1, "text_01", "abc "],
        [4, " text_02", "def"],
        [5, " text_03 ", " ghi"],
        [48, " text_04 ", "jkl"],
        [69, "text_05", "m n o"],
        [82, "text_06  ", " pq r "]

我尝试： from json_to_recordset .. as x(int,text,text)，或者： SELECT res::json->'abc'->'c' FROM main WHERE id = 3 ORDER BY .. ; - 不工作。

upd1：我可以这样做，但没有排序：

SELECT res::json->'abc'->'c' FROM main WHERE id = 3;
получаю:
             [
             [69, "text_05", "m n o"],
             [4, " text_02", "def"],
             [1, "text_01", "abc "],
             [48, " text_04 ", "jkl"],
             [5, " text_03 ", " ghi"],
             [82, "text_06  ", " pq r "]
             ]

因此，在一个循环中，它会创建四个 div，但不会向它们添加测试数据，例如 i ：

for (var j = 0; j < 4; j++) {

   document.getElementsByTagName("body")[0].innerHTML += '<div id="d0'+(j+1)+'" style ="font-size:12px; color:brown;"></div>';


   for (var i = 0; i < 2; i++) {

      document.getElementById('"d0'+(j+1)+'"').innerHTML += i;
   }
}

也许它是歪的：('"d0'+(j+1)+'"')告诉我，pliz，如何解决它？

请告诉我为什么它不起作用：mest.st("iii", 33)

import "fmt"

type Mstruct struct {
   name string
   age  int
}

func (m Mstruct) st(a string, b int) {
   m.name = a
   m.age = b
}

func main() {

   mest := Mstruct{"eee", 11}

   fmt.Println(mest)

   mest.st("iii", 33)

   fmt.Println(mest)

}

如果您将其更改为：

var mest Mstruct

func (m Mstruct) st(a string, b int) {
  mest.name = a
  mest.age = b
}

那可行。

xyz int [];

abc jsonb := ["1150,2021-02-22 13:24:04.587018+02,a39b5ab0-5812-4f.",
              "1151,2021-02-22 12:36:13.282165+02,a98f9ab0-5611-4f.",
              "1153,2021-02-22 12:36:13.282165+02,e36c3506-791b-4c."];

как на основе abc получить такой массив xyz ?
[1150, 1151, 1153]

红色、蓝色、绿色按钮，当按下时，将对应的 div 01、02、03 的颜色更改为指定的颜色。使用 ms 按钮（为方便起见）我为这三个 div 设置时间（延迟）。间隔 (setTimeout) 后的开始按钮将这些 div 的颜色从标准米色更改为橙​​色。

我希望在按下最后两个按钮后，可以使用红色、蓝色、绿色按钮更改 div 的颜色，如下所示：

• 如果您在 6 秒后按下绿色按钮，颜色将立即变为绿色，因为。3 秒延迟已经过去；- 如果你以这种方式按下红色按钮，那么颜色将在 2 秒内变为红色，因为 对于这个女主角，延迟设置为 8 秒；- 蓝色按钮类似于红色，但在 6 秒后。

function f01(d,s) {
    document.getElementById(d).style.background = s;
}
function f02() {
    let doc = document.getElementsByClassName('s');
    doc[0].value = 8000;
    doc[1].value = 12000;
    doc[2].value = 3000;
}
function start() {
    setTimeout(f03, document.getElementsByClassName('s')[0].value); // 8000  RED
    setTimeout(f04, document.getElementsByClassName('s')[1].value); // 12000 BLUE
    setTimeout(f05, document.getElementsByClassName('s')[2].value); // 3000  GREEN
    f01('d01','beige');
    f01('d02','beige');
    f01('d03','beige');  
}
function f03() {
    document.getElementById('d01').style.background = 'orange';
}
function f04() {
    document.getElementById('d02').style.background = 'orange';
}
function f05() {
    document.getElementById('d03').style.background = 'orange';
}

#d01, #d02, #d03 {width: 122px; height: 40px; background: beige;}
.s {width: 50px; height: 20px; font-size: 12px;}
.test {width: 60px; height: 26px; background: #CCCCCC;}

<button class="test" onclick="f02()">ms</button>
<br><br>
<div id="d01">01</div>
<input class="s" type="number">
<button class="test" onclick="f01('d01','red')">RED</button>
<br><br>
<div id="d02">02</div>
<input class="s" type="number">
<button class="test" onclick="f01('d02','lightblue')">BLUE</button>
<br><br>
<div id="d03">03</div>
<input class="s" type="number">
<button class="test" onclick="f01('d03','green')">GREEN</button>
<br><br>
<button class="test" onclick="start()">start</button>

如何正确地做到这一点，是否有可能具有一些通用功能来替换项目中不同位置的间隔。谢谢你。

如何正确设置样式，使块 v1 和 v2 在小屏幕上始终处于水平线上？就像图片中一样：

同时，以免在大屏幕上打破这种对齐方式：

在下面的代码中，在一个小屏幕上，它只能在很短的时间间隔内正常工作，否则它会像这样中断：

<style>
@media screen and (min-width: 428px) { /*Большой экран*/
    #aaa {float: left; width: 230px;}
    #vs1 {display : none;}
    #bbb {float: left; width: 170px;}
    #vs2 {display : block; clear: left;}
    #ccc {clear: left;}
}

@media screen and (max-width: 428px) { /*Маленький экран*/
    #aaa {width: 400px;}
    #vs1 {display: block;}
    #vs2 {display: none;}
    #bbb {width: 400px;}
}
</style>
</head>  
<body>

<div id="ab" style="">

       <div id="aaa" style="height: 200px; background-color: lightgreen; opacity: 0.3;">A</div>
       <div id="vs1">
               <div id="v1" style="float: left; width: 300px; height: 40px; background-color: orange; opacity: 0.3;">v1</div>
               <div id="v2" style="float: left; width: 100px; height: 40px; background-color: khaki; opacity: 0.3;">v2</div>
       </div>
       <div id="bbb" style="height: 200px; background-color: lightblue; opacity: 0.3;">B</div>

</div>       
<div id="vs2">
               <div id="v3" style="float: left; width: 300px; height: 40px; background-color: brown; opacity: 0.3;">v3</div>
               <div id="v4" style="float: left; width: 100px; height: 40px; background-color: yellow; opacity: 0.3;">v4</div>
</div>


<div id="ccc" style="width: 400px; height: 22px; background-color: red;">C</div>

</body>

在我添加的 html 文件中<head>：

<script>(function (){document.write('\x3Cscript src="/sss/j01.js?id=' + Number(new Date) + '">\x3C/script>');g_file = 'sss';}())</script>

在以这种方式包含的文件中，j01.js有一个函数myf与上面代码中声明的变量一起工作g_file = 'sss'。

不可能摆脱这个变量，例如，通过myf('sss')直接从上面的代码运行函数......告诉我，pliz，如何做到这一点。

那些。这也行不通if (document.write ...) myf('sss')：

<script>(function (){document.write('\x3Cscript src="/sss/j01.js?id=' + Number(new Date) + '">\x3C/script>');myf('sss');}())</script>

你只需要打开指定的.xlsx文件，然后它就会被手动编辑和关闭。连接的 PHPExcel 外部模块：

...\Classes\PHPExcel.php    и    ...\Classes\PHPExcel\IOFactory.php

进一步像这样：

$pExcel = PHPExcel_IOFactory::load("C:\\info\\p_f600.xlsx");

使用工作表等。例如，结果是这样的：

   // выбираем лист, с которым будем работать;
   $pExcel->setActiveSheetIndex(0);
   // получаем активный лист;
   $aSheet = $pExcel->getActiveSheet();

但我只需要打开文件。请告诉我如何正确地做。

如何正确设置样式以使img内部图像div没有底部水平“间隙”？在代码示例中，我试图消除图像之间的水平间隙。我尝试了 min/max -height 组合，但没有用。如何对照片进行无间隙的自适应排列？

#menu {
	width:100%;
	height:30px;
    background: #E8DDCF;
    border: solid 1px #E8DDCF;
}


#content {
    margin-top: 2px;
    display: inline-block;
	width:100%;	
    background: #F3E7D8;
    border: solid 1px #E8DDCF; 
}


.f {
    width: 98.4%;
	height: 9%;
    border: 1px solid #F3E7D8;    
    margin: 0 auto;
}


.f:hover {
    border: 1px solid red;
}


.container {
    position: relative;
    width: 12.5%;
    float: left;
}


.bottomleft {
    position: absolute;
    bottom: 5px;
    left: 5px;
    font-size: 11px;
    color: blue;
}

<body>
<div id="menu"> </div>	

<div id='content'>
<div id='fotos'>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="01"><div class="bottomleft">q</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="02"><div class="bottomleft">w</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="03"><div class="bottomleft">e</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="04"><div class="bottomleft">r</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="05"><div class="bottomleft">t</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="06"><div class="bottomleft">y</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="07"><div class="bottomleft">u</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="08"><div class="bottomleft">i</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="09"><div class="bottomleft">o</div></div>
<div class="container"><img class="f" src="http://party-boom.ru/catalog_photo/6018580s.png" alt="10"><div class="bottomleft">p</div></div>
</div>
</div>
</body>

请告诉我如何更正我示例中的样式，以便每张照片的左下角都有题词。只有当图片在一栏中时它才对我有用，但这是必要的 - “在一行中”。

#menu {
	width:100%;
	height:30px;
    background: #E8DDCF;
    border: solid 1px #E8DDCF;
}


#content {
    display: inline-block;/* иначе не видно рамки;*/
	width:100%;	
    background: #F3E7D8;
    border: solid 1px #E8DDCF;
}


#fotos img {
	border: solid 1px #E8DDCF;
    float: left;  /* иначе - все в один столбец;*/
    margin: 0 auto;
}


#fotos img:hover {
    border: 1px solid red;
}


.container {
    position: relative;
}


.bottomleft {
    position: absolute;
    bottom: 2px;
    left: 5px;
    font-size: 11px;
    color: blue;
}


.f {
	width: 12.33%;
	height: 9%;
    border: 1px solid #F3E7D8;
}

<body>
<div id="menu"> </div>	

<div id='content'>
<div id='fotos'>
<div class="container"><img class="f" src="DSC01.jpg" alt="01"><div class="bottomleft">q</div></div>
<div class="container"><img class="f" src="DSC02.jpg" alt="02"><div class="bottomleft">w</div></div>
<div class="container"><img class="f" src="DSC03.jpg" alt="03"><div class="bottomleft">e</div></div>
<div class="container"><img class="f" src="DSC04.jpg" alt="04"><div class="bottomleft">r</div></div>
<div class="container"><img class="f" src="DSC05.jpg" alt="05"><div class="bottomleft">t</div></div>
<div class="container"><img class="f" src="DSC06.jpg" alt="06"><div class="bottomleft">y</div></div>
<div class="container"><img class="f" src="DSC07.jpg" alt="07"><div class="bottomleft">u</div></div>
<div class="container"><img class="f" src="DSC08.jpg" alt="08"><div class="bottomleft">i</div></div>
<div class="container"><img class="f" src="DSC09.jpg" alt="09"><div class="bottomleft">o</div></div>
<div class="container"><img class="f" src="DSC10.jpg" alt="10"><div class="bottomleft">p</div></div>
</div>
</div>
</body>

请告诉我，如何找出他们点击的菜单嵌套级别？对于这样<li><a></a></li>的 ，它是最后一个元素，还是中间元素？最好不要为元素和跨浏览器分配额外的类。如果该元素是最后一个，那么当你点击它时，下拉列表必须关闭。谢谢你。

var m = '';

document.getElementById('hmenu').addEventListener("click", menu_onclick);


function menu_onclick() {
  // - - - - - - - - - - - - - - - - - - - - - - -
  // ? как узнать по какому уровню меню кликнули :
  //   - 1й уровень (Text_1, Text_2, Text_3)
  //   - 2й уровень (1, 2, 3)
  //   - 3й (a, b, c)
  // - - - - - - - - - - - - - - - - - - - - - - -
  // ? как узнать на какой уровень кликнули :
  //   первый, промежуточный, или последний
  // - - - - - - - - - - - - - - - - - - - - - - -
  var target = event.target || event.srcElement;
  if (target.style != m) {
    target.style.background = 'red';
    if (m != '') {
      m.background = '';
    }
    m = target.style;
  }
}

#menu {
  width: 100%;
  height: 30px;
  background: #ccc;
}
#hmenu {
  width: 100%;
  padding: 0;
  margin: 0;
  list-style-type: none;
  position: relative;
}
#hmenu li:nth-child(1) {
  width: 30%;
}
#hmenu li:nth-child(2) {
  width: 40%;
}
#hmenu li:nth-child(2) ul a {
  width: 150px;
}
#hmenu li:nth-child(2) >a:after {
  content: ' ▶';
  font-size: 12px;
}
#hmenu li:nth-child(2) li ul {
  background: #c6c6c6;
  left: 150px;
}
#hmenu li:nth-child(3) {
  width: 30%;
}
#hmenu li {
  float: left;
  position: relative;
}
#hmenu li a {
  font-size: 12px;
  text-decoration: none;
  display: block;
  line-height: 30px;
  text-align: center;
}
#hmenu li a:hover {
  background: goldenrod;
}
#hmenu li ul li {
  float: none;
}
#hmenu li ul li a {
  line-height: 25px;
}
#hmenu li ul {
  display: none;
  position: absolute;
  background-color: #c3c3c3;
  list-style: none;
  padding: 0;
}
#hmenu li:hover ul {
  display: block;
}
#hmenu li ul li ul,
#hmenu li:hover ul li ul {
  display: none;
  position: absolute;
  top: 0;
}
#hmenu li ul li:hover ul {
  display: block;
}

<body>
  <div id="menu">
    <ul id="hmenu">

      <li><a>Text_1</a>
      </li>
      <li><a>Text_2</a>
        <ul>
          <li><a>1</a>
          </li>
          <li><a>2</a>
            <ul>
              <li><a>a</a>
              </li>
              <li><a>b</a>
              </li>
              <li><a>c</a>
              </li>
            </ul>
          </li>
          <li><a>3</a>
          </li>
        </ul>
      </li>
      <li><a>Text_3</a>
      </li>
    </ul>
  </div>
</body>